Betydelsen av enhetslöst line-height i CSS

Värdet på egenskapen line-height behöver inte nödvändigtvis vara ett tal med någon enhet. Du kan också bara skriva ett tal eller ett bråktal. I det här fallet kan det verkliga värdet för line-height hittas genom att multiplicera det med värdet på font-size.

Till exempel, font-size är 10px, och line-height är 1.5. I det här fallet blir det verkliga värdet för line-height 10px * 1.5 = 15px. Den synliga vita mellanrummet mellan textraderna kommer att vara 5px: 15px - 10px = 5px.

Fördelen med att sätta line-height på detta sätt är att radavståndet automatiskt ändras när teckenstorleken ändras.

Låt oss se tillämpningen av det beskrivna med ett exempel:

<p>
	some long text
</p>

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

Låt teckenstorleken för stycken vara 30px. Sätt egenskapen line-height så att det synliga vita mellanrummet mellan stycken blir 15px. Använd ett enhetslöst värde för line-height.