CSS steht für „Cascading Style Sheet“, was übersetzt in etwa „hintereinander geschaltete Gestaltungsvorlage“ bedeutet. Stylesheets sind für die Gestaltung einer Website zuständig – und das ganz unabhängig von der Seitenstruktur, die mithilfe von HTML beschrieben wird. Mit Cascading Style Sheets können alle Elemente einer Website zentral gesteuert werden: mit ihrer Hilfe lassen sich die Größe von Überschriften, Abstände zwischen Textabschnitten, die verwendeten Schriftarten und sogar Hintergrundbilder festlegen – und auch rasch anpassen oder ändern. Darüber hinaus dienen sie auch dazu, die Inhalte für verschiedene Ausgabemedien – wie zum Beispiel Computer, Smartphones oder zum Drucken – so aufzubreiten, dass sie gut lesbar dargestellt werden können.
Ein anschauliches Beispiel dafür, wie unterschiedlich eine Website mittels CSS gestaltet werden kann, bietet der CSS Zen Garden. Hier finden sich hunderte Versionen ein und derselben Website, die Webdesigner weltweit entwickelt und dem Projekt beigesteuert haben. So lässt sich eindrucksvoll erleben, wie eine Website allein durch Anklicken einer Designvorlage ihr Aussehen verändert.
Das Web ist ein dynamisches Gebilde, und auch die Technologien, auf denen es basiert, ändern sich. CSS 2.1 war lange Jahre der Standard für Stylesheets. Er soll nun von CSS3 abgelöst werden. Derzeit befinden wir uns in einer Übergangsphase: viele Features von CSS3 werden von modernen Browsern bereits unterstützt, aber eben noch nicht alle. Wer testen möchte, wie die verschiedenen Browser im einzelnen auf die neuen CSS3-Eigenschaften und -Selektoren reagieren, kann dies auf dieser Seite tun.
CSS3 bietet viele interessante neue Features, die Webdesignern dabei helfen, die Optik einer Website zentral und komfortabel zu steuern. So lassen sich grafische Effekte wie abgerundete Ecken oder farblich hervorgehobene Tabellenzeilen, an denen Webdesigner früher lange feilen mussten, dank CSS3 schnell und einfach umsetzen.
Ein weiteres Beispiel für eine praktische Neuerung in CSS3 sind Media Queries. Es ist schon eine ganze Weile möglich, mit CSS medienspezifische Stylesheets zu definieren. Dank Media Queries können Sie nun die Darstellung einer Seite auf den Bildschirm des Betrachters zuschneiden – was vor allem für die Ausgabe einer Site auf Smartphones extrem nützlich ist. Denn mithilfe von Media Queries lässt sich nun recht einfach die Auflösung, die Ausrichtung des Bildschirms (Portrait oder Landscape), die Ausmaße des Geräts sowie des Browserfensters ermitteln.
Aber nicht nur das Aussehen einer Website oder die Darstellung auf verschiedenenen Endgeräten können mit Hilfe von CSS3 vielfältig gestaltet werden – auch bei der Visualisierung eines Musiktitels kann CSS3 zusammen mit HTML5 beeindruckendes leisten. Auf der Seite http://daftpunk.themaninblue.com/ wird ein Mashup – also ein Mix aus mehreren Liedern – mittels beiden Webentwicklungswerkzeugen optisch dargestellt.
Wie dieses Beispiel zeigt, entfaltet CSS3 seine volle Pracht erst im Zusammenspiel mit HTML5. Diesen beiden Technologien widmet sich das gerade in deutscher Übersetzung erschienene Buch „HTML5 & CSS3“ vom Brian P. Hogan.