 3) Einbindung wohin mit dem Stylesheeet?
Die CSS-Formatierung soll für genau den Text / die Seitenelemente gelten, für die Sie eine Formatierung wünschen. Die Formatangaben können in mit unterschiedlichen Verfahren eingebunden werden.
|
|
3 Verfahren die CSS-Anweisungen einzubinden
CSS-Anweisungen einbinden - ÜBERSICHT
CSS-Sylesheets können in 3 unterschiedlichen Verfahrensweisen in ein HTML-Dokument eingebunden werden. Alle 3 Techniken können sogar innerhalb einer Seite kombiniert werden.
- interne CSS-Anweisungen (Stylesheeet im Head der HTML-Datei)
- externe CSS-Anweisungen (Stylesheeet in einer externen Datei)
- inline CSS-Anweisungen (Direktformatierung innerhalb der Seite)
CSS-Anweisungen seitenintern
Die erste Möglichkeit haben Sie bereits kommentarlos auf meiner Seite 'CSS-Deklaration' kennen gelernt.
Style-Angaben werden zwischen den Tags <style> und </style> im Kopf der Seite innerhalb der Tags <head> und </head> notiert.
<head>
<style type="text/css">
<!--
-->
</style>
</head>
Die CSS-Anweisungsblöcke stehen innerhalb der CSS-Deklaration im Head der HTML-Datei.
CSS-Anweisungen in externer Datei
Um nun jedoch diese Definitionen nicht in jede HTML-Datei einkopieren zu müssen, ist es möglich die CSS-Anweisungen in eine externe Datei auszulagern. Diese kann dann in alle / mehrere HTML-Dokumente ihres Web-Projekts eingebunden werden.
Sobald Sie innerhalb ihrer Musterseite die passenden Deklarationen festgelegt haben, können Sie daran gehen die CSS-Anweisungen in eine zentrale, externe CSS-Datei auszulagern. Dort stehen dann die CSS-Anweisungen für ihr gesamtes WEB-Projekt.
Erklärungen zum Aufbau einer externen CSS-Datei und deren Einbindung in ihre HTML-Seiten finden Sie auf der Seite
 4) Anweisungen in externe Datei auslagern
Inline CSS-Anweisungen
Diese Formatierungsanweisungen werden direkt in ein HTML-Tag integriert und sind für dieses Element gültig.
Beispiele:
<p style="color: #8F8F8F; padding: 5px">
Text in grau - Abstand 5 Pixel
</p>
<p style="color: #0000FF; align: center">
Text in blau - zentriert
</p>
<p style="font-weight: bold;">
Text in Fettschrift
</p>
Weiter gehts auf der Seite 4 ...
4 CSS-Anweisungen auslagern
Die CSS-Anweisungen in eine externe Datei auszulagern, bringt ihnen erhebliche Vorteile. Neben den weiter unten aufgeführten Gründen ist nicht unerheblich, dass die HTML-Seiten kleiner werden, und die externe CSS-Datei nur einmal vom Server geladen werden muss. Erklärungen zu ausgelagerten Style Sheets finden Sie hier:
Weiter zur Seite: 4) externe CSS-Datei
5 CSS Inline-Anweisungen
CSS-Anweisungen können auch "an Ort und Stelle", also 'im fließenden Inhalt' der Seite eingebettet werden. Diese Formatierungsanweisungen werden direkt in ein HTML-Tag integriert und sind für dieses Element gültig. Erklärungen lesen Sie hier:
Inline-Anweisungen
|
Home • CSS • CSS einbinden
