line-height

(Auszug aus "CSS − Anspruchsvolle Websites mit Cascading Stylesheets" von Rachel Andrew & Dan Shafer)

Die Eigenschaft line-height beschreibt die Zeilenhöhe für ein Element. Enthält eine Zeile mehr als ein Element, bestimmt das Element mit der größten Einstellung für line-height die Höhe der gesamten Zeile.

Vererbt: Ja (mit Unterschieden bei den unten aufgeführten Formaten)

Siehe auch: font und font-size

Werte

line-height unterstützt die folgenden Formate:

• normal: Diese Konstante ist der Standardwert und entspricht gemäß der CSS-Spezifikation einem numerischen Wert zwischen 1.0 und 1.2.
• numerischer Wert: Ein numerischer Wert (zum Beispiel 1.5) ergibt als Multiplikator mit der Schriftgröße die Höhe der Zeile. Eine Einstellung von 1.0 stellt die Zeilen so eng wie möglich dar, ohne Überlappung der Zeichen. Eine Einstellung von 1.2 erzeugt einen normalen Abstand zwischen den Zeilen. Vererbt wird der Wert als proportionaler Faktor und als bereits für das übergeordnete Element errechneter absoluter Wert. Für ein untergeordnetes Element mit größerer Schrift wird mit einem geerbten Wert ein entsprechend größerer Zeilenabstand erzeugt als für das übergeordnete Element mit der kleineren Schrift.
• CSS-Maßangabe: Eine absolute CSS-Maßangabe (zum Beispiel 50px) oder eine relative CSS-Maßangabe. Ein relativer Wert in em (M-Höhe) bewirkt das gleiche Ergebnis wie ein numerischer Wert, vererbt an ein untergeordnetes Element jedoch den bereits für das übergeordnete Element errechneten Wert und nicht den Wert als proportionalen Faktor.
• Prozentwert: Ein Prozentwert multipliziert mit der Schriftgröße ergibt die Höhe einer Zeile. Wie auch bei Längenangaben ist die Zeilenhöhe proportional zur Schriftgröße, untergeordnete Elemente erben aber den bereits für das übergeordnete Element errechneten Wert und nicht den Wert als proportionalen Faktor.

Standardwert: normal

Kompatibilität

CSS-Version: 1

Funktioniert in allen CSS-fähigen Browsern, einschließlich Internet Explorer ab Version 4, Netscape ab Version 4 und Mozilla.

Beispiel

Folgende Stilregel legt für Elemente der Klasse luftig eine Zeilenhöhe fest, die der anderthalbfachen Schriftgröße entspricht:

Da ein numerischer Wert deklariert wird, wird die Zeilenhöhe für untergeordnete Elemente um den proportionalen Faktor 1,5 ihrer eigenen Schriftgröße berechnet. Würde stattdessen ein Wert von 150% oder 1.5em benutzt, würde untergeordneten Elemente die absolute Zeilenhöhe des übergeordneten Elements zugewiesen.