HTML5-Handbuch - die neuen Features von HTML5

Regeln.
Sortierung nach Ursprung und Priorität
    Im ersten Schritt wird ermittelt, ob für ein Element CSS-Eigenschaften definiert wurden, die für den aktuellen Medientyp gelten. Medientypen sind beispielweise Bildschirm, Papier, Projektor, Handheld-Display, Fernseher, Braille-Zeile oder Screenreader. Dabei wird in allen Fällen zwischen Browser-, Autoren- und Benutzer-Stylesheets unterschieden. Werden in den unterschiedlichen Stylesheets mehrere Angaben gefunden, die auf die gleichen Elemente der HTML-Dokumentstruktur zutreffen, wird nach folgender Reihenfolge und absteigender Priorität (Wichtigkeit) sortiert:
    1. Benutzer-Stylesheet-Definitionen mit
!important
    2. Autoren-Stylesheet-Definitionen mit
!important
    3. Autoren-Stylesheet-Definitionen
    4. Benutzer-Stylesheet-Definitionen
    5. Browser-Stylesheet-Definitionen
    Die Basis für die Darstellung bildet das Browser-Stylesheet. Enthält ein Benutzer-Stylesheet jedoch widersprüchliche Angaben, überschreiben diese die Angaben im Browser-Stylesheet. Kommt nun ein Autoren-Stylesheet mit Formatierungen hinzu (das sind die Stylesheets, die Sie als Webseiten-Anbieter bereitstellen), so werden diese im Konfliktfall höher gewichtet als die des Benutzer-Stylesheets. Das gilt allerdings nicht für Format-Definitionen des Benutzer-Stylesheets, die mit der
!important
-Anweisung (siehe weiter unten)versehen sind. Bei so ausgezeichneten Format-Definitionen behält das Benutzer-Stylesheet oberste Priorität.
    Der Grund für diese oberste Priorität ist, dass Menschen mit Beeinträchtigungen in der Wahrnehmung letztlich für beliebige Webseiten selbst bestimmen können sollen, wie sie die Inhalte präsentiert bekommen. In der Praxis ist diese schöne Theorie jedoch sehr grau. Denn welcher Benutzer macht sich schon die Mühe und verfügt über das nötige Fachwissen, um sich alle möglichen Websites auf eigene Bedürfnisse zuzuschneiden? Intelligente Software könnte solche Benutzer-Stylesheets aber nach allgemeinen Vorlieben und Vorgaben automatisieren.
Die !important-Regel
    Mit
!important
ausgezeichnete Format-Definitionen haben Vorrang vor widersprechenden Angaben, die keine solche Anweisung enthalten. Der Einsatz von
!important
ist sowohl in Autoren- als auch in Benutzer-Stylesheets möglich.
Beispiel
    p { font-size: 1em !important; }
Erläuterung
    Die Zeichenkette
!important
(Ausrufezeichen und das unmittelbar anschließende Wort important = wichtig) wird hinter der Wertzuweisung an eine CSS-Eigenschaft notiert. Erst dann folgt das abschließende Semikolon.
13.2.16      Spezifität – Gewichtung der Selektoren
    Nicht nur zwischen Browser-, Benutzer- und Autoren-Stylesheets gibt es festgelegte Rangfolgen. Auch unter den Selektoren, die innerhalb eines Stylesheets versammelt sind, herrschen Prioritätsregeln. Dabei werden alle Selektoren zunächst in ihre Bestandteile zerlegt und diese in folgende Kategorien unterteilt:
•   Kategorie A erhält den Wert 1 , wenn CSS-Format-Definitionen direkt im
style
-Attribut eines HTML-Elements notiert sind.
•   Kategorie B erhält den Wert 1 bei Selektoren für Elemente mit
id
-Attributen.
•   Kategorie C entspricht der Anzahl der von einem Selektor betroffenen Klassen und Pseudoklassen.
•   Kategorie D entspricht der Anzahl der von einem Selektor betroffenen Elementnamen und Pseudo-Elemente.
Beispiele

Erläuterung
    Die Tabelle zeigt die Kategorisierung aller Bestandteile der angeführten Selektoren in absteigender Reihenfolge ihrer Spezifität. Zunächst werden alle Selektoren nach ihrem in Spalte A angeführten Wert absteigend sortiert, danach nach dem in den Spalten B , C und zuletzt nach Spalte D . Ein Wert von "1 0 0 0" ist daher höher als "0 1 2 0" oder "0 0 1 2". Im oben angeführten Beispiel erreicht der Selektor
#nav a.xy
die höchste Spezifität (0 1 1 1) und überschreibt damit die vorangegangenen Deklarationen. Die nachfolgend notierten Selektoren
li a
(0 0 0 2) und
#nav li a
(0 1 0 2) weisen eine geringere Spezifität auf und werden daher übergangen:

    Existiert im Stylesheet nur ein Selektor mit der höchsten ermittelten Spezifität, wird sein Format angewendet. Andernfalls entscheidet die Reihenfolge des Vorkommens (siehe weiter unten).
Weitere Hinweise
    Der Universalselektor
*
und obsolete HTML-Formatierungen wie
align="center"
finden in dieser Rangfolgenermittlung keine Berücksichtigung.
    CSS 2.1 weicht in folgenden Punkten von CSS 2.0 ab:
    Direkt in HTML notierte
style
-Attribute waren in