Text-decoration
CSS vlastnost text-decoration určuje podtržení textu a jiné "přikrášlení".
| hodnoty | přikrášlení textu |
|---|---|
| none | žádné |
| underline | podtržení |
| overline | nadtržení |
| line-through | přeškrtnutí |
| blink | blikání |
Normálně není text nijak dekorován.
Odkazy mají výchozí dekoraci podtržení (a změnou text-decoration se dá udělat, aby podtrhané nebyly). Podtržený je i obsah tagu <ins> (což mi přijde nelogické). Na webu byste neměli podtrhávat nic, co není odkaz -- a naopak -- odkazy podtrhávejte.
Obsah tagů <s>, <strike> a <del> mají výchozí dekoraci přeškrtnutí. Pomocí text-decoration: none se jim dá přeškrtnutí zrušit. Naopak text-decoration: line-through; použijte u zrušených cen a zrušených textů (které z nějakého důvodu nechcete mazat).
Podpora
Velmi dobře podporovaná vlastnost, dobrá hlavně na podtrhávání. Blikání nefunguje v žádné verzi Internet Exploreru. Netscape 4 neumí overline.
| Prohlížeč | Podpora ve verzích | Poznámka |
|---|---|---|
| všechny verze | IE neumí blinkat | |
| Mozilla (Firefox, Netscape 6+ atd.) | všechny verze | |
| Opera | všechny verze | |
| Chrome | ano |
Marek Prokop ve své knize o CSS uvádí nespecifikované problémy podpory (nepotvrzeno). Asi tím myslí to blikání v Exploreru.
Příklady
Jak udělat, aby odkazy nebyly podtržené:
<style>
a:link, a:visited {text-decoration: none}
</style>
Pokud se u odkazů vypíná podtrhávání, často se přidává pravidlo, aby při se při přejetí myší (stav :hover) podtrhly:
<style>
a:link, a:visited {text-decoration: none}
a:hover {text-decoration: underline}
</style>
Další příklady
Reklama
