Teksti-luetelmakohta - CSS-temppuja

text-indentOminaisuus määrittää, kuinka paljon tilaa vaakasuunnassa tekstin tulisi siirtää ennen alkua ensimmäisen rivin tekstin sisällön elementin. Väli lasketaan lohkotason konttielementin aloitusreunasta.

Aloitusreuna on yleensä vasemmalla, mutta voi olla oikea, jos oikealta vasemmalle -tilassa, ala suunta-ominaisuus.

text-indentOminaisuus periytyy kun määritetty lohkoelementistä, jotka välineet se vaikuttaa inline-block jälkeläinen piirteitä. Kun käsittelet sisäisiä lapsia, saatat haluta pakottaa heidät siihen text-indent: 0;.

Syntaksi

text-indent: | | inherit && ( hanging || each-line ) p ( text-indent: 1.5em; )

Yleinen käyttötapaus olisi yksinkertaisesti tyylillinen. Kappaleiden ensimmäisen rivin sisennys on eräänlainen vanhanaikainen ja voi herättää tämän tunteen. Sitä voidaan käyttää kappaleen jälkeisen välin sijasta vaihtoehtoisena visuaalisena indikaattorina, vaikka väli on luultavasti luettavampaa yleensä.

Toinen yleinen käyttötapaus on "kuvan korvaaminen", jossa teksti erotetaan elementistä tekstin sisennyksen ja piilotetun ylivuoton kautta.

riippuva

hangingon kokeellinen ja epävirallinen arvoa varten text-indentomaisuutta. Se kääntää, mitkä viivat on sisennytetty. Pohjimmiltaan se sisennyttää jokaisen rivin paitsi ensimmäisen, mikä johtaa jonkinlaiseen roikkumiseen-välimerkkeihin.

Tämä arvo on lippu, joka kulkee yhdessä yhteisen arvon, kuten pituuden, kanssa.

jokaisella rivillä

each-lineon kokeellinen ja epävirallinen arvoa varten text-indentomaisuutta. Ajatuksena on sisennys jokaiselle riville pakotetun viivanvaihdon jälkeen (a: lla
).

Tämä arvo on lippu, joka kulkee yhdessä yhteisen arvon, kuten pituuden, kanssa.

Demo

Katso Chris Coyierin (@chriscoyier) kynän teksti-luetelmakohta CodePenistä.

Selaimen tuki

Perustuki

Kromi	Safari	Firefox	Ooppera	IE	Android	iOS
minkä tahansa	minkä tahansa	minkä tahansa	3,5+	3+	minkä tahansa	minkä tahansa

riippuva arvo

Kromi	Safari	Firefox	Ooppera	IE	Android	iOS
ei mitään	ei mitään	ei mitään	ei mitään	ei mitään	ei mitään	ei mitään

jokaisen rivin arvo

Kromi	Safari	Firefox	Ooppera	IE	Android	iOS
ei mitään	ei mitään	ei mitään	ei mitään	ei mitään	ei mitään	ei mitään