line-height
Nuosavybė apibrėžia, kiek vietos viršuje ir apačioje inline elementų. Tai yra elementai, kurie yra nustatyti display: inline
arba display: inline-block
. Ši savybė dažniausiai naudojama norint nustatyti teksto eilučių priekį.
p ( line-height: 1.5; )
line-height
Turtas gali priimti raktažodžių vertybes normal
ar none
taip pat skaičių, ilgį, arba procentais.
Remiantis specifikacija, „normalaus“ reikšmė nėra tik viena konkreti reikšmė, taikoma visiems elementams, o apskaičiuojama į „pagrįstą“ vertę, atsižvelgiant į elementui nustatytą (arba paveldėtą) šrifto dydį.
Ilgio reikšmę galima apibrėžti naudojant bet kurį galiojantį CSS vienetą (px, em, rem ir kt.).
Procentinė vertė yra elemento šrifto dydis, padaugintas iš procento. Pavyzdžiui:
Patikrinkite šį rašiklį!
Aukščiau pateiktoje demonstracijoje trijų pastraipų linijos aukštis nustatytas atitinkamai 150%, 200% ir 250%. Turinio elemento šrifto dydis nustatytas 20 taškų. Tai reiškia, kad pastraipoms apskaičiuotas eilutės aukštis yra atitinkamai 30px, 40px ir 50px.
„Unitless Line“ aukštis
Rekomenduojamas linijos aukščio nustatymo metodas yra skaičiaus vertės, vadinamos „be vieneto“ linijos aukščio, naudojimas. Skaičio vertė gali būti bet koks skaičius, įskaitant skaičių po kablelio, kaip nurodyta pirmajame kodo pavyzdyje šiame puslapyje.
Vienetinių linijų aukštis rekomenduojamas dėl to, kad antriniai elementai paveldės neapdoroto skaičiaus vertę, o ne apskaičiuotą vertę. Tai atlikę vaikai elementai gali apskaičiuoti savo eilučių aukštį, atsižvelgdami į apskaičiuotą šrifto dydį, o ne paveldėti savavališką vertę iš tėvų, kurią greičiausiai reikia pakeisti.
Naršyklės palaikymas
„Chrome“ | „Safari“ | „Firefox“ | Opera | T.Y | „Android“ | „iOS“ |
---|---|---|---|---|---|---|
Veikia | Veikia | Veikia | Veikia | Veikia | Veikia | Veikia |
IE6 / 7 neteisingai apskaičiuos linijos aukštį ant pakeistų elementų (pvz., Formos valdiklių), kurie yra tiesūs.