Bedeutung der einheitenlosen line-height in CSS

Der Wert der Eigenschaft line-height muss nicht unbedingt eine Zahl mit einer Einheit sein. Man kann auch einfach eine Zahl oder einen Bruch schreiben. In diesem Fall kann der tatsächliche Wert von line-height ermittelt werden, indem man ihn mit dem Wert von font-size multipliziert.

Zum Beispiel ist font-size gleich 10px, und line-height ist 1.5. In diesem Fall beträgt der tatsächliche Wert von line-height 10px * 1.5 = 15px. Nun, der sichtbare weiße Abstand zwischen den Textzeilen wird 5px sein: 15px - 10px = 5px.

Der Vorteil dieser Methode zur Angabe von line-height liegt darin, dass sich bei einer Änderung der Schriftgröße automatisch auch der Zeilenabstand ändert.

Sehen wir uns die beschriebene Methode an einem Beispiel an:

<p>
	some long text
</p>

p {
	font-size: 20px;
	line-height: 1.5;
	text-align: justify;
	width: 400px;
}

Angenommen, die Schriftgröße für Absätze beträgt 30px. Setzen Sie die Eigenschaft line-height so, dass der sichtbare weiße Abstand zwischen den Absätzen 15px beträgt. Verwenden Sie dafür einen Wert für line-height ohne Einheiten.