CSS

Im Abschnitt XHTML wird dargestellt, wie man im WWW Informationen darstellen kann. Das Layout der Seiten sollte aus den genannten Gründen mit Hilfe von CSS gestaltet werden. Dazu gibt es grundsätzlich zwei verschiedene Möglichkeiten. Die Entscheidung, welche von beiden vorzuziehen ist, ergibt sich aus der Wiederverwendbarkeit.

Möchte man ein grundsätzliches Fromat für viele Seiten festlegen, liegt es nah, dass die Formate in einer speziellen CSS-Datei (siehe XHTML) niedergeschrieben werden und von den entsprechenden Seiten durch folgenden Eintrag im head eingebunden wird:

<link href="format.css" type="text/css" rel="stylesheet"/>

Die Datei hat kein umfassendes Grundgerüst, sondern besteht aus einer Auflistung von tags, deren Standardverhalten geändert wird. Wird eine CSS-Datei wie beschrieben in XHTML eingebunden, so wird die Datei beispielsweise wie folgt aufgebaut:

h3 {
    color : #0000FF;
}
 
img {
    display : block;
    margin: auto;
}

Die Erläuterung:

• Zunächst kommt der Name des tags, dessen Verhalten geändert werden soll.
• In geschweifte Klammer eingeschlossen folgen die Attribute mit ihren neuen Werten, getrennt durch Semikolons.
• Im Beispiel wird die Schriftfarbe der 3.-größten Überschrift auf blau gesetzt. Bilder werden in einer einzelnen Zeile (display:block) zentriert (beide Ränder auf Automatik) dargestellt.

Für einseitige Homepages oder Spezialanpassungen ist es unnötig eine komplette CSS-Datei anzulegen. Man kann die oben aufgeführten Änderungen am Layout auch innerhalb der HTML-Datei direkt notieren. Der folgende Code wird dann im head eingefügt:

<style type="text/css">
    h3 {
        color : #0000FF;
    }
 
    img {
        display : block;
        margin: auto;
    }
</style>

So definierte Formate müssen dann natürlich für jede Seite einzeln notiert werden.

Manchmal ist es notwendig einem Befehl ein spezielles Format zu verpassen, dass nicht überall gelten soll. Auch hier muss man nicht auf CSS verzichten. Beispielsweise kann eine Überschrift eine eigene Farbe erhalten:

<h1 style="color:#00ff00">Hier ist eine grüne Überschrift</h1>

Mehrere Optionen können in den Anführungszeichen durch Semikolons getrennt werden.