| |
| Vorteile und Funktionsweisen von CSS |
HTML bietet selbstverständlich die Möglichkeit Texte zu formatieren. Jedoch muss diese Formatierung zumindest für jede Seite explizit gemacht werden. Der Vorteil von CSS besteht nun eigentlich darin, die Formatierungsinformation eines gesamten Webauftritts in einer separaten Datei zu speichern und nach Bedarf eben nur an einer Stelle die Änderung vornehmen zu müssen statt wie bisher in jeder HTML Seite.
Die Möglichkeiten, wie man ein Style Sheet integriert sind vielfältig. Im Folgenden wird zuerst Grundsätzliches und danach die unterschiedlichen Integrations-Möglichkeiten erklärt.
GRUNDSÄTZLICH GILT:
Ein HTML Element wie beispielsweise h1 kann durch ein Style Sheet mit einer Eigenschaftsliste verbunden werden, die das Aussehen des Elementes h1 bestimmt. Benutzen Sie das Element h1 ohne weitere Eigenschaften zu definieren werden die Standardvorgaben des Elementes zur Darstellung genutzt – sehen Sie dazu auch folgendes Beispiel:
So sieht's aus
Öffnen Sie alle Dateien zum Betrachten mit Ihrem Internetbrowser oder zum bearbeiten mit einem HTML- bzw. Text-Editor. Sie können sich jederzeit den Quelltext einer HTML Seite in Ihrem Browser anschauen. Aktivieren Sie hierfür beim Internet Explorer den Menüpunkt Ansicht und klicken Sie auf Quelltext. Bei Netscape finden Sie den Quelltext unter dem Menüpunkt Anzeigen und Seitenquelltext.
h1 {color:green}
So sieht's aus
Zunächst steht zu Beginn das Element, hier h1, das in geschweiften Klammern eine Eigenschaftsliste zugewiesen bekommt. Die Eigenschaft besteht aus einer Eigenschaftsbezeichnung, (color), und einem Wert, hier (green legt fest dass h1 in grün dargestellt wird), wobei Eigenschaftsbezeichnung und Wert durch einen Doppelpunkt getrennt sind.
h1 {color:green; font-size:12pt}
So sieht's aus
In diesem Beispiel werden zwei Eigenschaften zugewiesen und durch ein Semikolon getrennt. Der Eigenschaftsbezeichnung font-size wird der Wert 12pt zugewiesen.
h1, h2, h3 {font-family:Arial}
So sieht's aus
Hier werden gleich mehreren Elementen (Sie sind durch Kommata getrennt) die gleiche Eigenschaft zugewiesen. Alle Elemente werden in der Schriftart Arial dargestellt. |
|
 |
|
|
