Secció 3: Propietats
3. Propietats relacionades amb el text
3.9. text-indent
Aquesta propietat estableix el sagnat de la primera línia d'un element. Típicament s'utilitza en els paràgrafs, per exemple en el que estàs llegint ara, però de fet és aplicable a qualsevol element de bloc. Els valors permesos són longituds i percentatges.
P { text-indent: 3em; }
P.noindent { text-indent: 0px; }
Una pàgina que utilitzés paragrafs així definits tindria el següent aspecte:
Aquest és un paràgraf sense classe. La primera línia està sagnada. El valor 3em significa que la sangria serà el resultat de multiplicar per tres la mida de la font.
Aquest és un paràgraf de classe 'noindent'. Com pots veure, la primera línia comença ara a la mateixa posició horitzontal que la resta. Aquest és el valor per defecte que pren la propietat 'text-indent'.
Un aspecte a tenir en compte és que els percentatges fan referència a l'amplada de l'element de bloc afectat i no a la mida de la font. Per exemple, el següent style sheet (no et preocupis dels estils dels DIV, ho estudiarem més endavant):
P { text-indent: 20%; }
DIV { width: 400px; border: 1px solid silver; }
DIV.nota { width: 200px; }
generaria un resultat amb el següent aspecte:
Aquest és un paràgraf dins un DIV 'normal'. La primera lína es situa al 20% de l'amplada total del DIV (400px), és a dir, a la posició 80px.
Aquest paràgraf està situat dins un DIV de classe 'nota'. En aquest cas, com que el DIV té una amplada de 200px, la primera línia del paràgraf es situa a la posició 40px.
No és el més corrent, però una altra possibilitat és assignar un valor negatiu a text-indent. En aquest cas la primera línia sobresortirà del paràgraf per l'esquerra (prova-ho!).
3. Propietats relacionades amb el text: text-decoration
