CSS

Cascaded Style Sheet = CSS

Cascading Style Sheets (engl. [kæs?ke?d???sta?l?i?ts]; Abk.: „CSS“) ist eine deklarative Stylesheet-Sprache für strukturierte Dokumente (z. B. HTML und XML), die vom World Wide Web Consortium (W3C) spezifiziert wird. Durch die Trennung von Stil und Inhalt wird das Veröffentlichen und Betreuen von Dokumenten wesentlich vereinfacht. CSS wurde vor allem im Hinblick auf HTML entwickelt, ist aber auch für XML-Dokumente anwendbar. CSS ermöglicht es auch, Inhalte dem jeweiligen Ausgabemedium (z. B. Druck, Projektion, Sprachausgabe usw.) entsprechend abzuändern. Das ist nützlich, um zum Beispiel Weblinks beim Drucken extra aufzuführen und nicht (wie oft bei HTML-Seiten) zu verbergen. Oder um für ein Anzeigemedium wie einen PDA oder ein Mobiltelefon mit geringerer Auflösung die Anzeige zu optimieren (geringere Seitenbreite und -höhe).

Die Fähigkeiten von CSS sind vielfältig: Neben diversen, weit über HTML hinausgehenden Fähigkeiten im Farb- und Schriftbereich, die sich allerdings (noch) nicht mit spezialisierten Textsatzsprachen wie TeX messen können, bietet es etwa die Möglichkeit, alle Elemente frei zu positionieren oder Hintergrundbilder festzulegen.

CSS gilt heutzutage als die Standard-Stylesheet-Sprache für das Web.

Inhaltsverzeichnis

* 1 Geschichte und Versionen

* 2 Syntax

* 3 Kombination mit HTML bzw. XHTML

* 4 Siehe auch

* 5 Weblinks

Geschichte und Versionen

Das Konzept der Cascading Style Sheets (CSS) wurde 1994 durch Håkon Wium Lie vorgeschlagen. Bert Bos arbeitete zu dieser Zeit an der Implementation eines Browsers namens Argo, der seine eigene Stylesheet-Sprache benutzte. Die beiden entschieden sich, zusammenzuarbeiten und CSS zu entwickeln.

Es gab zu dieser Zeit auch andere Sprachen mit dem gleichen Ziel, CSS brachte aber als erste die Idee auf, Regeln zu definieren, die über mehrere Stylesheets hinweg vererbt werden konnten.

Nach der Präsentation von CSS durch Håkon an der Konferenz „Mosaic and the Web“ in Chicago 1994, und später mit Bos 1995 wurde das World Wide Web Consortium (W3C) auf CSS aufmerksam. Håkon and Bos arbeiteten in diesem Rahmen an CSS weiter, zusammen mit anderen Mitgliedern, u. a. Thomas Reardon von der Firma Microsoft. Im Dezember 1996 wurde dann die CSS Level 1 Recommendation publiziert. Diese wird in aktuellen Browsern mittlerweile nahezu vollständig umgesetzt.

CSS Level 2 (CSS2) wurde im Mai 1998 veröffentlicht. Bis heute wird diese Empfehlung noch nicht hinreichend von allen verbreiteten Browser implementiert. Manche Browser setzen den größten Teil von CSS2 korrekt um, andere hingegen bieten nur eine mangelhafte Unterstützung von wenigen Teiltechniken. Bei der praktischen Anwendung im Web ergeben sich daher oft unnötige Schwierigkeiten.

Momentan arbeitet das W3C an einer Zwischenversion CSS Level 2 Revision 1 (CSS 2.1), die die Erfahrungen mit CSS2 berücksichtigt, Unstimmigkeiten korrigiert und diejenigen Teiltechniken streicht, die bisher nicht in verschiedenen Browsern korrekt implementiert wurden. CSS 2.1 bringt selbst keine grundlegend neuen Fähigkeiten mit sich.

Gleichzeitig ist CSS Level 3 in der Entwicklung. Hier werden die Entwicklungen weiter vorangetrieben, die bereits bei CSS2 gestartet wurden. CSS3 wird im Gegensatz zu den Vorgängern modular aufgebaut sein, d. h. einzelne Teiltechniken (beispielsweise zur Steuerung der Sprachausgabe) haben ihren eigenen Entwicklungsrhythmus und Versionsschritte. So nähert sich CSS bei seinen Fähigkeiten mehr dem etablierten DSSSL (für SGML) an und stellt wohl auch in Zukunft noch eine attraktive Alternative zu XML-basierten Stylesheet-Sprachen wie XSL-FO dar.

Syntax

Die Syntax besteht aus einzelnen Regeln – Zuweisungen von verschiedenen Deklarationsbereichen, bestehend aus einer oder mehreren Deklarationen, die wiederum aus Eigenschaftsbezeichner und Wert bestehen, zu Selektoren, die z. B. HTML-Elemente sein können:

Selektor { Eigenschaft-A: Wert-A; Eigenschaft-B: Wert-B; } /* Kommentar */

Das Ganze stellt (ohne den Kommentar) eine Regel dar. In den geschweiften Klammern befindet sich der Deklarationsbereich, hier mit zwei Deklarationen. Jede Regel kann beliebig viele Deklarationen enthalten.

Beispiel:

/* Kursiver, roter Text auf weißem Hintergrund */

p.note {

font-style: italic;

color: red;

background-color: white;

}

Hier wird der Deklarationsbereich allen p-Elementen zugewiesen, die das class-Attribut mit dem Wert note besitzen. Würde man das p im Selektor weglassen, würden alle Elemente mit dem Attributwert note betroffen sein, bei Weglassen des .note alle p-Elemente.

Ein wichtiges Prinzip von CSS ist die Vererbung der Eigenschaftswerte an untergeordnete Elemente und die Kombination verschiedener Stylesheets (Kaskade). Diese können dabei aus verschiedenen Quellen stammen: vom Autor des Stylesheets, dem Browser (User Agent) oder dem Benutzer.

Kombination mit HTML bzw. XHTML

Die am häufigsten vorkommende Kombination, nämlich mit HTML oder XHTML, kann an drei Orten geschehen:

1. Als externes Stylesheet

1. für eine (X)HTML-Datei (link-Element),

2. für eine XHTML-Datei (xml-stylesheet-Verarbeitungsanweisung),

2. als internes Stylesheet in einer (X)HTML-Datei (style-Element),

3. innerhalb von (X)HTML-Tags (style-Attribut).

Beispiel für das Laden eines Stylesheets namens beispiel.css im head-Element eines HTML-Dokuments:

oder

In der Regel ist die Verwendung eines externen Stylesheets am sinnvollsten, da dieses die Trennung von Layout und Inhalt ermöglicht. Besteht eine Website beispielsweise aus zehn einzelnen HTML-Dokumenten, so zieht eine Änderung der Schriftart bei der Verwendung eines externen Stylesheets lediglich eine Änderung in dieser Datei nach sich. Würde man in diesem Beispiel auf die Verwendung von Stylesheets verzichten, so müsste in jedem HTML-Dokument jedes Auftreten des Font-Tags angepasst werden.

Beispiel für CSS von Prof. Wagner