Vererbung in CSS

Bei der Anwendung der Definitionen in CSS-Stylesheets gilt eine bestimmte Rangfolge. Nehmen wir das Beispiel einer Webseite, die sowohl auf ein externes Stylesheet verweist als auch interne Formatdefinitionen enthält.

Wie im Abschnitt „Grundlagen von CSS" beschrieben, werden zuerst die Definitionen des externen Stylesheets angewandt und dann die internen Definitionen des gleichen Selektors. Im folgenden Beispiel wird für den h2-Selektor zunächst die Definition aus dem externen Stylesheet verwendet. Ist für eine Eigenschaft im eingebetteten Stylesheet ein anderer Wert angegeben, wird dadurch die Angabe im externen Stylesheet außer Kraft gesetzt.

Externes Stylesheet

h2

{

color: blue;

text-align: left;

font-size: 10pt}

Eingebettetes Stylesheet

h2

{

text-align: right;

font-size: 20pt

}

Die folgenden Eigenschaften werden für den h2-Selektor verwendet:

color: blue;

text-align: right;

font-size: 20pt

 

Wie Sie sehen, wird die Farbe vom externen Stylesheet übernommen, Textausrichtung und Schriftgröße werden dagegen vom eingebetteten Stylesheet bestimmt.