Der Zusammenhang zwischen Konzepten wie Vererbung, Standardwert und Kaskade ist auch für viele fortgeschrittene CSS-Schreiber oft noch ein Buch mit sieben Siegeln. Dieser Beitrag erklärt den Sachverhalt mit wenigen Worten und einer Grafik.

Wenn der Browser ein HTML-Element gestalten soll, sammelt er zunächst alle  für dieses Element relevanten Deklarationen im CSS. Nach dieser Sammelaktion gibt es drei Möglichkeiten:

• Keine Deklaration » Vererbung oder Standardwert 
  Findet der Browser überhaupt keine Deklaration, prüft er, ob die Eigenschaft vererbbar ist und schaut dann in den Vorfahrenelementen. Wird auch nichts vererbt, nimmt er den Standardwert.
• Eine Deklaration » Fertig 
  Findet der Browser genau eine Deklaration, gestaltet er das Element damit.
  
• Mehrere Deklarationen » Kaskade 
  Findet der Browser mehrere Deklarationen, werden diese zuerst nach Wichtigkeit (!important), dann nach Spezifität (Typ, Klasse, ID, Inline) und zum Schluß nach Reihenfolge sortiert, bis ein eindeutiger Gewinner feststeht. 

Die folgende Grafik visualisiert diesen Prozess und zeigt den "Browser auf der Suche nach einem Wert" für eine bestimmte Eigenschaft zur Gestaltung des HTML-Elements ist.

Mehr zu diesem Thema finden Sie in Kapitel 11 "Die Kaskade".