ZUM-Unterrichten - Logo.png
Viele Inhalte sind umgezogen ins neue ZUM-Unterrichten.

Cascading Style Sheets

aus ZUM-Wiki, dem Wiki für Lehr- und Lerninhalte auf ZUM.de
Wechseln zu: Navigation, Suche

Cascading Style Sheets (engl. für stufenförmige oder (hintereinander) geschachtelte Formatfestlegungen), kurz CSS genannt, sind eine deklarative Sprache für Stilvorlagen (engl. stylesheets). Sie dienen dazu bei Markup-Sprachen wie HTML und XML-Sprachen wie SVG Inhalt und Präsentation voneinander zu trennen.

Inhaltsverzeichnis

Einführung

Der Inhalt eines HTML-Dokuments wird durch Elemente ausgezeichnet und strukturiert. Diese Elemente haben browsereigene Stile, z.B. ist die Standardschriftfarbe schwarz und Überschriften werden z.B. größer als Text in Absätzen angezeigt.

CSS (Cascading Style Sheets) ermöglicht eine eigene Formatierung für HTML-Elemente. Solche Eigenschaften können beispielsweise Farben, Schriftgrößen, Hintergrundfarben, Abstände, Schriftarten und das Layout festlegen.

Hier ein Vergleich: Links ohne CSS, rechts mit einer CSS-Beispielformatierung.

Ein HTML-Dokument ohne CSS Ein HTML-Dokument mit CSS

Entwicklung

Style Sheets wurden im Jahr 1994 von Hakon Wium Lie vorgeschlagen und in Zusammenarbeit mit Bert Bos entwickelt. Die Idee waren definierte vererbbare Regeln zur Gestaltung.

  • Der erste Norminierungsvorschlag CSS Level 1 wurde Ende 1996 vom W3C verabschiedet.
  • 2011 Veröffentlichung von CSS 2.1 (Überarbeitete Version von CSS2 mit Berücksichtigung auf bereits in Browsern implementierte Funktionen)
  • CSS3 ist seit 2000 in Entwicklung. Es ist modular aufgebaut und Teiltechniken wurden und werden in eigenen Versionsschritten entwickelt.

Syntax

Eine Regel besteht aus dem Selektor für das Element, auf das die Regel wirken soll und CSS-Regelsätzen, die in geschweiften Klammern stehen und durch Semikolons voneinander getrennt sind. Ein CSS-Regelsatz besteht aus Eigenschaften, denen ein Wert zugewiesen wird.

Beispiel:

p {
  color: white;
  background-color: blue;
}

Das Beispiel würde den Hintergrund des Absatzes blau färben und die Textfarbe weiß. Weitere Informationen finden sich in den Weblinks.

Siehe auch

Weblinks

  • Selfhtml-Wiki: CSS
Portalseite mit deutschsprachiger Dokumentation und vielen Tutorials
Sehr ansprechendes Tutorial
Eigentlich eine Seite zu einem Buch. Hier gibt es auch Tipps und ein Forum zu CSS.
CSS-Workshop, Eigenschaften, CSS-Referenz Level 1 und 2, Tipps und Tricks (seit 2005 nicht mehr aktualisiert)
Tricks zu CSS(3) (und Javacript) auf Englisch