De text-indenteigenschap geeft aan hoeveel horizontale ruimte tekst moet worden verplaatst vóór het begin van de eerste regel van de tekstinhoud van een element. De afstand wordt berekend vanaf de beginrand van het containerelement op blokniveau.
De startrand bevindt zich meestal aan de linkerkant, maar kan rechts zijn in de modus van rechts naar links, ala de richting-eigenschap.
De text-indenteigenschap wordt overgeërfd wanneer deze wordt gespecificeerd op een blokelement, wat betekent dat het ook van invloed is op inline-blokonderliggende elementen. Als je te maken hebt met inline-block-kinderen, wil je ze misschien dwingen text-indent: 0;.
Syntaxis
text-indent: | | inherit && ( hanging || each-line ) p ( text-indent: 1.5em; )Een veelvoorkomend geval zou eenvoudig stilistisch zijn. Het inspringen van de eerste regel van alinea's is een beetje ouderwets en kan dat gevoel oproepen. Het kan worden gebruikt in plaats van spaties na alinea's als een alternatieve visuele indicator, hoewel spatiëring in het algemeen waarschijnlijk beter leesbaar is.
Een ander veelvoorkomend geval is bij "afbeeldingvervanging", waarbij tekst uit het element wordt getrapt via tekstinspringing en verborgen overloop.
hangend
hangingis een experimentele en niet-officiële waarde voor het text-indentonroerend goed. Het keert om welke regels worden ingesprongen. In principe wordt elke regel ingesprongen behalve de eerste, wat resulteert in een soort hangende interpunctie.
Deze waarde is een vlag die samengaat met een gemeenschappelijke waarde, zoals een lengte.
elke regel
each-lineis een experimentele en niet-officiële waarde voor het text-indentonroerend goed. Het idee is om elke regel te laten inspringen na een geforceerd regeleinde (met een
Deze waarde is een vlag die samengaat met een gemeenschappelijke waarde, zoals een lengte.
Demo
Zie de Pen-tekstinspringing door Chris Coyier (@chriscoyier) op CodePen.
Browser-ondersteuning
Basisondersteuning
| Chrome | Safari | Firefox | Opera | D.W.Z | Android | iOS |
|---|---|---|---|---|---|---|
| ieder | ieder | ieder | 3.5+ | 3+ | ieder | ieder |
hangende waarde
| Chrome | Safari | Firefox | Opera | D.W.Z | Android | iOS |
|---|---|---|---|---|---|---|
| geen | geen | geen | geen | geen | geen | geen |
elke regelwaarde
| Chrome | Safari | Firefox | Opera | D.W.Z | Android | iOS |
|---|---|---|---|---|---|---|
| geen | geen | geen | geen | geen | geen | geen |