Хусусияти line-height

Хусусияти line-height фосилаи байни сатрҳои матнро (фосилаи байнисатрӣ) таъин мекунад.

Хусусият фосилаи байни сатрҳои матнро чун ки эҳтимол аст, таъин намекунад, балки баландии сатри матн-ро таъин мекунад. Ин маънои онро дорад, ки фосилаи воқеӣ байни сатрҳо ба ин шакл ҳисоб карда мешавад: line-height - font-size = фосилаи байни сатрҳои матн. Ё баръакс line-height = font-size + фосилаи байни сатрҳои матн.

Синтаксис

интихобкунанда {
	line-height: қимат;
}

Қиматҳо

Қимати хусусият ҳар гуна воҳидҳои андоза мебошад. Ҳангоми муайян кардани қимат бо % фосилаи байнисатрӣ дар фоизи андозаи шрифт хоҳад буд.

Илова бар ин, шумо метавонед ҳар гуна рақами бузургтар аз сифрро ҳамчун қимат муайян кунед. Дар ин ҳолат, он ҳамчун заррабабанди андозаи шрифт қабул карда мешавад. Масалан, агар font-size қимати 20px дошта бошад, ва line-height - 1.5 бошад, он ҳамон аст, ки line-height: 30px навишта шавад (20px * 1.5 = 30px).

Бо таври пешфарз хусусият қимати normal дорад, дар ин ҳолат браузер фосилаи байнисатрӣ -ро худкор интихоб мекунад.

Намуна

Дар ин намуна фосилаи байни сатрҳои матн line-height - font-size = 38px - 18px = 20px хоҳад буд:

<p>
	some long text
</p>

p {
	font-size: 18px;
	line-height: 35px;
	text-align: justify;
}

Намуна

Фосиларо то 25px - 18px = 7px коҳиш медиҳем:

<p>
	some long text
</p>

p {
	font-size: 18px;
	line-height: 25px;
	text-align: justify;
}

Намуна

Дар ин намуна фосилаи байни сатрҳои матн line-height - font-size = 18px - 18px = 0px хоҳад буд - сатрҳо амалан ба ҳам мечаспанд (домҳои ҳарфҳои сатри болоӣ ба домҳои ҳарфҳои сатри поёнӣ мерасад):

<p>
	some long text
</p>

p {
	font-size: 18px;
	line-height: 18px;
	text-align: justify;
}

Намуна

Дар ин намуна қимати line-height - заррабабанди 1.5 аз андозаи шрифт мебошад. Аз ин рӯ, line-height ба font-size * 1.5 = 18px * 1.5 = 27px баробар хоҳад буд. Ва фосилаи воқеии байни сатрҳо line-height - font-size = 27px - 18px = 9px хоҳад буд:

<p>
	some long text
</p>

p {
	font-size: 18px;
	line-height: 1.5;
	text-align: justify;
}

Намуна

Заррабабандро зиёд мекунем:

<p>
	some long text
</p>

p {
	font-size: 18px;
	line-height: 2.5;
	text-align: justify;
}

Намуна

Агар line-height аз font-size хурдтар карда шавад, сатрҳо умуман бар рӯи якдигар меафтанд:

<p>
	some long text
</p>

p {
	font-size: 18px;
	line-height: 13px;
	text-align: justify;
}