Cascading Style Sheets

aus ZUM-Wiki, dem Wiki für Lehr- und Lerninhalte auf ZUM.de

Die Cascading Style Sheets (engl. für stufenförmige oder (hintereinander) geschachtelte Gestaltungsvorlagen), kurz CSS genannt, sind quasi eine deklarative Sprache für Stilvorlagen (eng. stylesheets) von strukturierten Dokumenten. Sie wird vor allem zusammen mit HTML und XML (zum Beispiel bei SVG) eingesetzt.

Inhaltsverzeichnis 1 Einführung 2 Entwicklung 2.1 Browserunterstützung 2.2 CSS3 3 Syntax 4 Schulischer Einsatz 5 Linkliste 6 Siehe auch

Einführung

HTML-Tags strukturieren die Seite und jeder Browser hat einen gewissen Style für sie, z.B. ist die Standardschriftfarbe schwarzunh h-Tags werden z.B. größer als das p-Tag 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.

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.

1995 hat Zusammenarbeit mit dem W3C begonnen und der erste Norminierungsvorschlag wurde Ende 1996 verabschiedet. Inzwischen findet die Weiterentwicklung von CSS durch eine Arbeitsgruppe beim W3C statt.

Browserunterstützung

• CSS Level 1 Recommendation fast vollständig von allen Browsern implementiert (1996 veröffentlicht)
• CSS Level 2 bisher nur von manchen
• 2011 Veröffentlichung von CSS 2.1 (Ãœberarbeitete Version von CSS2 mit Berücksichtigung auf bereits in Browsern implementierte Funktionen)

CSS3

CSS in Version 3 ist schon seit 2000 in Entwicklung. Es ist modular aufgebaut und Teiltechniken wurden und werden in eigenen Versionsschritten entwickelt. Deswegen unterstützen moderne Browser CSS3-Techniken schon teilweise.

Das Ziel von CSS3 ist es, Style und Inhalt vollkommen voneinander abgegrenzen werden (im Zusammenhang mit HTML5).

Syntax

Eine Regel besteht aus dem Selektor für das Element, auf das die Regel wirken soll und den Eigenschaften, die dem Element zugewiesen werden. CSS-Regeln stehen in geschweifte Klammern und sind durch Semikolons voneinander getrennt. Beispiel:
p {
color: #FFFFFF;
background-color: #0070C0;
}
Das Beispiel würde den Hintergrund des Absatzes blau färben und die Textfarbe weiß. Weitere Informationen finden sich in der Linkliste

Schulischer Einsatz

Linkliste

• http://www.css-praxis.de/

Eigentlich eine Seite zu einem Buch. Hier gibt es auch Tipps und ein Forum zu CSS.

• http://www.css4you.de

CSS-Workshop, Eigenschaften, CSS-Referenz Level 1 und 2, Tipps und Tricks

• http://www.xpw18.de

XPW18.DE bietet Ihnen Materialien, Lösungen, Tipps & Tricks aus der privaten Werkstatt eines Webdesigners. Die Themenbandbreite reicht dabei von verschiedenen Webdesign-Techniken über Javascript-Lösungen bis hin zu Überlegungen zur farblichen und grafischen Gestaltung von Webprojekten, schließlich auch zu zeitgemäßen Webdesigntechniken wie Cascading Stylesheets und XHTML.

• http://www.css-hilfe.de

CSS-Kurs, Forum, Tutorials und Datenbank

• http://www.css-technik.de

Ressourcen, Scripte, Tutorials

• http://www.style-sheets.de/
• http://www.mediaevent.de/css/index.html

Sehr ausführliches "Nachschlageseite"

• http://de.selfhtml.org/css/index.htm

Der CSS-Teil von Selfthtml

• Einen Einblick in die Möglichkeiten von CSS kann man unter der Seite http://www.csszengarden.com/tr/deutsch/ bekommen.
• http://css-tricks.com/

Tricks zu CSS(3) (und Javacript) auf Englisch

• Cascading Style Sheets

Siehe auch

• Barrierefreie Seiten im Internet
• Software
• Dateiformate