De text-indent
egenskab angiver, hvor meget vandret plads tekst skal flyttes før begyndelsen af den første linje af teksten indholdet af et element. Afstand beregnes fra startkanten af containerelementet på blokniveau.
Startkanten er normalt til venstre, men kan være højre, hvis den er i højre mod venstre-tilstand, ala retningsegenskaben.
Den text-indent
egenskab er arvet når den er specificeret på en blok element, hvilke organer det vil påvirke inline-block efterkommerlinjer elementer. Når du beskæftiger dig med inline-block-børn, kan du måske tvinge dem til det text-indent: 0;
.
Syntaks
text-indent: | | inherit && ( hanging || each-line ) p ( text-indent: 1.5em; )
En almindelig brugssag ville være simpelthen stilistisk. Indrykket af den første linje i afsnit er lidt gammeldags og kan vække den følelse. Det kunne bruges i stedet for afstand efter afsnit som en alternativ visuel indikator, selvom afstand sandsynligvis er mere læsbar generelt.
En anden almindelig brugssag er i "billederstatning", hvor tekst sparkes ud af elementet via tekstindryk og skjult overløb.
hængende
hanging
er en eksperimentel og uofficiel værdi for text-indent
ejendommen. Det vender om, hvilke linjer der er indrykket. Dybest set indrykker det hver linje undtagen den første, hvilket resulterer i en slags hængende-tegnsætning.
Denne værdi er et flag, der følger med en fælles værdi som en længde.
hver linje
each-line
er en eksperimentel og uofficiel værdi for text-indent
ejendommen. Ideen er at indrykke hver linje efter et tvunget linjeskift (med a
).
Denne værdi er et flag, der følger med en fælles værdi som en længde.
Demo
Se pennens tekstindryk af Chris Coyier (@chriscoyier) på CodePen.
Browsersupport
Grundlæggende support
Chrome | Safari | Firefox | Opera | IE | Android | iOS |
---|---|---|---|---|---|---|
nogen | nogen | nogen | 3.5+ | 3+ | nogen | nogen |
hængende værdi
Chrome | Safari | Firefox | Opera | IE | Android | iOS |
---|---|---|---|---|---|---|
ingen | ingen | ingen | ingen | ingen | ingen | ingen |
værdi for hver linje
Chrome | Safari | Firefox | Opera | IE | Android | iOS |
---|---|---|---|---|---|---|
ingen | ingen | ingen | ingen | ingen | ingen | ingen |