Browser-Stylesheets: Grundlagen und Beispiele

Jens Meiert, 25. Februar 2008. ISSN 1614-3124, Ausgabe 36.

CSS kümmert sich um die Standardformatierung von Dokumenten durch das Konzept der Browser- beziehungsweise User-Agent-Stylesheets, einen Eckpfeiler der Kaskade. Dieses sorgt dafür, dass ein Browser nicht einfach nur eine lange Zeile Text darstellt, wenn er mit einem HTML-Dokument gefüttert wird, dem keine Styling-Informationen mitgegeben wurden, sondern es statt dessen mit einfacher Formatierung anzeigt.

Die Begriffe Browser-, User-Agent-, Standard- und Default-Stylesheet werden in diesem Artikel synonym verwendet.

Abbildung: HTML-Dokument mit Default-Darstellung in Firefox.

Spezifikation

Bereits CSS 1 sieht vor, dass jeder User-Agent (UA, oftmals ein ›Webbrowser‹ oder ›Webclient‹) ein Standard-Stylesheet besitzen wird, das Dokumente in vernünftiger – jedoch nüchterner – Weise darstellt. CSS 2 spricht davon, dass konforme User-Agents ein Standard-Stylesheet einsetzen müssen (oder sich so verhalten, als würden sie dies tun) und dass das Standard-Stylesheet eines User-Agents die Elemente der Dokumentensprache in einer Form darstellen sollte, die die allgemeinen Erwartungen an die Anzeige für diese Dokumentensprache erfüllt; CSS 3 ist mit an Sicherheit grenzender Wahrscheinlichkeit derselben Ansicht.

Da die CSS-Spezifikationen also den Implementierungen überlassen, ob diese tatsächlich ein »echtes« Stylesheet für die Standarddarstellung einsetzen oder nicht, ist es nicht überraschend, dass man nicht im Installationsordner jedes Browsers ein solches Stylesheet vorfindet. Im Gegensatz zu beispielsweise Microsofts Internet Explorer und (soweit bekannt) Opera erleichtern jedoch Gecko-Browser wie Firefox oder Netscape Navigator (»html.css«) genauso wie Konqueror das Verständnis der von ihnen gewählten Standarddarstellung, indem sie »echte« Stylesheets an Bord haben.

Beispieldateien

Es folgt eine Liste von Browser-Stylesheets, die sowohl unterschiedliche Browser als auch Jahre berücksichtigt und somit Unterschiede zwischen den Browsern und auch Entwicklungen aufzeigt. Aufgrund der Tatsache, dass Firebird, Firefox und Co. auf derselben Layout-Engine basieren, ergeben sich einige Ähnlichkeiten, wenn nicht sogar Entsprechungen.

Diese Liste wird in späteren Aktualisierungen nicht nur Veröffentlichungsdaten beinhalten, sondern auch größere Unterschiede dokumentieren.

Beachten Sie zum Vergleich auch die exemplarischen Stylesheets, die vom W3C in den Spezifikationen von CSS 1, CSS 2 und CSS 2.1 vorgeschlagen werden:

Browser- und Reset-Stylesheets

Die genannten Beispiele – tatsächlich verwendete Stylesheets – sollen den Einblick in Browser-Stylesheets erleichtern, denn Kenntnis von diesen trägt dazu bei, ein größeres Verständnis von CSS sowie bestimmten »Darstellungsphänomenen« zu erhalten.

Nichtsdestotrotz sollte dieses Wissen für andere Dinge als das Erstellen weiterer oder umfangreicherer Reset-Stylesheets eingesetzt werden. Unter der Voraussetzung, dass ein solches Stylesheet noch durch weitere CSS-Regeln zur Formatierung der jeweiligen Website ergänzt wird, sind diese »Reset«- oder »Undo«-Stylesheets selten notwendig und die in der Regel zu beobachtende Redundanz möglicherweise weder weise noch professionell. Aus eigener Erfahrung entspricht * { margin: 0; padding: 0; } dem einzig benötigten und gleichzeitig am besten zu merkenden »Pseudo-Reset«, und das Kritikern zum Trotz, die ausgerechnet dieser Methode »auf einmal« Leistungseinbußen im µs-Bereich vorwerfen. Ein entsprechender Artikel, der Reset-Stylesheets genauer beleuchtet, befindet sich in Vorbereitung.

Dieser Artikel kann im englischsprachigen Originalbeitrag kommentiert werden (auf Englisch).

Jens Meiert