====== Vererbung ====== Vererbung heißt, dass Stileigenschaften von einem Element an ein beliebiges in ihm enthaltenes Element weitergegeben werden. Bei guter Planung kann die Vererbung Stilangaben sehr effizient machen. Oder einfacher: Die Eigenschaften eines Elements werden von dem übergeordneten bestimmt, sofern sie nicht überschrieben werden. ===== Vererbung an untergeordnete Elemente ===== CSS-Eigenschaften werden teilweise an untergeordnete Elemente vererbt und teilweise nicht. Eigenschaften wie die Schriftgröße, die Vorder- und Hintergrundfarben, font-weight, text-decoration, font-style, ... werden an die untergeordneten Elemente weitervererbt, d.h. von diesen übernommen, solange: * das untergeordnete Element diese Eigenschaft nicht selbst für sich festlegt * das untergeordnete Element für diese Eigenschaft keinen Standardwert vom Browser erhält (z.B. bei den h-Elementen die Größe und bei Links die Farbe und Unterstreichung Im 2. Fall kann man ein Element dazu zwingen, den Wert des übergeordneten Elements dennoch auf sich zu vererben und den Standardwert zu ignorieren, das geht indem man der Eigenschaft den Wert **inherit** zuweist. Ob dieser Wert zur verfügung steht, ist der CSS4You-Seite der einzelnen Eigenschaften zu übernehmen. **Beispiel:** ''font-size: inherit;'' Ein Beispiel für eine Eigenschaft, die nicht vererbt wird, ist der Rahmen (border) - was durchaus logisch und gut erscheint. Die Angabe, ob ein Element vererbbar ist oder nicht, findet man stets auf der jeweiligen Eigenschaftsinfoseite auf CSS4You. **kleines Anwendungsbeispiel:** Anwendungsbeispiel Vererbung

Dieser Überschrift ist die font-size: Angabe des div-Elements egal, sie belässt es bei ihrer eigenen Größe, weil wir sie auch nicht mit inherit zur Vererbung zwingen.

Dieser Absatz übernimmt die Eigenschaften des übergeordneten div-Elements anstandslos.

Wie die Überschrift möchte dieser Link die Standardeigenschaft für color: (blau) gerne übernehmen. Mit inherit hindern wir ihn jedoch daran.

Dieser Absatz legt die background-color-Eigenschaft selbst fest, darum wird sie auch nicht vererbt.

Alle gemeinsam übernehmen sie die Schriftart Verdana, weil kein Element diese selbst festlegen will!

 ===== Relative Einheiten bei der Vererbung ===== Eine Besonderheit bei der Vererbung gibt es bei der Vererbung von relativen Größen. Dann bezieht sich nämlich die Größe des untergeordneten Elements relativ auf das Übergeordnete. Weißt man einem übergeordnetem Element also die Schriftgröße fonz-size: 0.8em zu, so bezieht sich eine Schriftgrößenangabe eines untergeordneten Elements auf diese 0.8em. **Beispiel:** Man weißt einem

-Element font-size: 0.8em zu, einem untergeordnetem -Element ebenfalls 0.8em. Dann ist die Schriftgröße des -Elements erneut um den Faktor 0.8 verringert. Beispiel Vererbung relativer Einheiten

Das ist ein Text im p-Element mit 0.8em
Das ist ein Text im untergeordneten span-Element, dem ebenfalls 0.8em Schriftgröße zugewiesen sind.

===== Links ===== * [[http://www.css4you.de/wscss/css08.html|CSS4You: Informationen über die Vererbung]]