CSS: Styl textu

Úpravy textu - mezery mezi slovy, řádky, zarovnání atd.

text-transform

Velikost písmen může být buď tak jak ji píšete, první písmeno velké, všechna velká, nebo malá. Mám na mysli funkci klávesy CAPS LOCK.

text-transform: none | capitalize | uppercase | lowercase

<span style="text-transform: lowercase">
vše MaLÝMI písmENy
</span>

Ukázka (sranda je, když si ten text někam překopírujete pomocí CTRL+C a vložíte CTRL+V): vše MALÝmi písmeny

Můžete tím usměrňovat výpisy knihy návštěv, ale asi to moc nevyužijete.

word-spacing

Nastavuje mezery mezi slovy

word-spacing: normal | délka

style="word-spacing: 40px"

některá slova je potřeba prostrkat

text-align

Zarovná text doleva, doprava, nastřed a nebo dobloku

text-align: left | right | center | justify

text-decoration

Nastaví dekoraci - podtržení, nadtržení, přetržení, blikání (to nefunguje v IE)

none | underline | overline | line-through | blink

style="text-decoration: overline underline line-through"

rozškrtaný text

vertical-align

Vertikální zarovnání - horní index, dolní

vertical-align: baseline| sub| super| top| text-top| bottom| text-bottom| 10%

style="vertical-align: sub"

dolní index

text-indent

Odsazení řádku od levého kraje. Používá se pro první řádek odstavce

text-indent: 30px | 15pt | 20%

style="text-indent: 45px"

První řádek bude trochu odsazený pokud nastavíte celému odstavci nějakou hodnotu vlastnosti text-indent. Na webu jsem to ještě moc neviděl.

white-space

Nastavuje chování tak jako s tagem <pre> (řádky se zalamují ENTEREM), nastavuje nazalamování

white-space: none | pre | nowrap

style="white-space: pre"

line-height

Nastavuje výšku řádky

line-height: normal | 10px | 10%

style="line-height: 30px"

normální řádek
normální řádek
30px vysoký
normální řádek

display

Hodnota none - text (obrázek, linka cokolo) bude skryt, block - prvek se bude chovat jako blokový prvek (<p>), inline - řádkový prvek např. jako <span>

display: none | inline | block

Další: Rámeček (border) a okraje (padding, margin)

Navigace