CSS line-height eigenschap

Definitie en gebruik

De line-height-eigenschap stelt de afstand tussen rijen in (rijhoogte).

Opmerking:Negatieve waarden zijn niet toegestaan.

Beschrijving

Deze eigenschap beïnvloedt de indeling van de regelbox. Bij toepassing op een blokelement definieert het de minimale afstand tussen de baselines in plaats van de maximale afstand.

Het verschil tussen de berekende waarde van line-height en font-size (in CSS wordt dit 'regelafstand' genoemd) wordt in tweeën gedeeld en toegevoegd aan de bovenkant en de onderkant van een tekstregel. De kleinste box die deze inhoud kan bevatten, is de regelbox.

De oorspronkelijke getalwaarde specificeert een schaalfactor, waarvan afstammende elementen afleiden in plaats van de berekende waarde.

Zie ook:

CSS tutorial:CSS tekst

HTML DOM referentiehandleiding:lineHeight eigenschap

Voorbeeld

Stel de regelhoogte in met percentage:

p.small {line-height:90%}
p.big {line-height:200%}

Probeer het zelf

(Meer voorbeelden zijn te vinden aan de onderkant van de pagina)

CSS syntaxis

line-height: normal|number|length|initial|inherit;

Eigenschapswaarde

Waarde Beschrijving
normal Standaard. Stel een redelijke regelafstand in.
number Stel een getal in, dat wordt vermenigvuldigd met de huidige lettergrootte om de regelafstand in te stellen.
length Stel een vaste regelafstand in.
% Percentage van de huidige lettergrootte voor de regelafstand.
inherit Stelt dat de waarde van de line-height-eigenschap van het ouder-element moet worden geërfd.

Technische details

Standaardwaarde: normal
Inheritance: ja
Versie: CSS1
JavaScript syntaxis: object.style.lineHeight="2"

TIY voorbeeld

Gebruik een percentage om de regelafstand in te stellen
Dit voorbeeld toont hoe je een percentagewaarde kunt gebruiken om de regelafstand in een paragraaf in te stellen.
Gebruik een pixelwaarde om de regelafstand in te stellen
Dit voorbeeld toont hoe je een pixelwaarde kunt gebruiken om de regelafstand in een paragraaf in te stellen.
Gebruik een getal om de regelafstand in te stellen
Dit voorbeeld toont hoe je een getal kunt gebruiken om de regelafstand in een paragraaf in te stellen.

Browserondersteuning

De cijfers in de tabel vermelden de eerste browserversie die deze eigenschap volledig ondersteunt.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 7.0