Websiteentwicklung: CSS: Zeilenhöhe
Aus Wikibooks
Inhaltsverzeichnis |
[Bearbeiten] Erklärung
Das line-height -Element bestimmt die Zeilenhöhe.
Dieses Element ist bei viel Fließtext praktisch und wird vor allem in der Typografie oft verwendet.
[Bearbeiten] Mögliche Einstellungen
Der Abstand kann mit allen numerischen Werten (px, em, ...) angegeben werden.
Auch Prozentangaben sind möglich. Diese beziehen sich auf die Schriftgröße.
[Bearbeiten] Beispiele
Beispiel 1:
line-height: 0.5em;
Die Zeilenhöhe entspricht 0.5em.
Achtung: Wenn die Schriftgröße größer ist als die Zeilenhöhe, wie hier zu sehen ist, können sich die Zeilen überschneiden.
Beispiel 2:
font-size: 15px; line-height: 200%;
Bei diesem Beispiel ist die Zeilenhöhe 110% der Schriftgröße.
Die Prozentangabe ist bei line-height von Vorteil, da man so vermeiden kann, die Zeilen überschneiden zu lassen, sofern man eine Angabe >= 100% verwendet.