[CSS - Cascading Style Sheets]

[Inhalt]

[Einleitung]

HTML stellt die Syntax für die Definition der Webseiten-Struktur bereit, etwa die Angabe einer Überschrift, das Einfügen einer Leerzeile zwischen zwei Absätzen oder die Anordnung von Listenelementen. HTML ist jedoch nicht für Webseiten-Präsentationen zuständig.

1997 hat das W3C eine Empfehlung für die Cascading Style-Sheets herausgegeben, die Ihnen helfen soll, die Darstellung einer Webseite zu steuern. CSS Stylesheets sind eine Ergänzung zu HTML, eine Sprache zur Definition von Formateigenschaften einzelner HTML-Elemente.

Stylesheets bieten viele Möglichkeiten, die mit normalem HTML nicht realisierbar sind. Sie können HTML-Elementen eigene Hintergrundfarben, eigenen Hintergrundbildern oder mit Rahmen ausstatten. Sie können die Positionierung von Elementen im Anzeigefenster pixelgenau steuern. Einige CSS-Eigenschaften sind auch in der Lage, das Anzeigefenster des Browsers zu beeinflussen, so etwa das Aussehen des Cursors oder der Scrollbalken. Spezielle Filter, die allerdings rein Microsoft-spezifisch sind, erlauben Grafik-Effekte bei normalen Texten.

Ein Leistungsmerkmal von CSS, welches vor allem die Macher grösserer Websites schätzen werden, ist die Möglichkeit, zentrale Formate zu definieren. Sie können Ihre Stylesheet-Definitionen in separaten Dateien ablegen, diese Stylesheet-Dateien können danach in beliebig vielen HTML-Dateien referenziert werden. Auf diese Weise können Sie einheitliche Layouts entwerfen, mit ein paar kleinen Änderungen in einer zentralen Stylesheet-Datei können Sie dann für hunderte von HTML-Dateien ein anderes Aussehen bewirken.

Zu guter Letzt muss erwähnt werden, dass CSS ein wichtiger Bestandteil von DHTML (Dynamic HTML) ist, indem es die Voraussetzungen für die dynamische Änderung von Elementeigenschaften bietet.

Sowohl Netscape als auch Microsoft haben den CSS- Standard übernommen, wobei keiner der beiden ihn vollständig implementiert hat und das auch noch in unterschiedlicher Form, was zu den üblichen, unterschiedlichen Darstellungsweisen der Webseiten führen kann. Es bleibt Ihnen also auch hier nicht erspart, Ihre Seiten mit allen gängigen Browsern auszutesten.

Die folgenden Seiten erheben keinen Anspruch auf Vollständigkeit, sondern bieten Ihnen einen Überblick über Cascading Style Sheets sowie einige Beispiele an.

[Einführendes Beispiel]

<STYLE type="text/css">
   H1 { color: red; font-family: Arial; margin: 1.0in}
</STYLE>

In diesem Beispiel wird der Stil für H1-Überschriften so gesetzt, dass eine rote Schrift, die Schriftart Arial und rundum ein Rand von einem Zoll verwendet werden.
Mit Hilfe dieser Einstellungen in dem Style-Sheet werden alle H1-Elemente in diesem Dokument auf den neuen Stil gesetzt.

Copyright © 1998- Nightfire Java Archiv