Text-transform
CSS vlastnost text-transform určuje převod na velká nebo malá písmena.
| hodnoty | převedení velikosti písmen |
|---|---|
| none | nic se nepřevádí |
| capitalize | první písmena všech slov budou velká |
| uppercase | všechna písmena se převedou na velká |
| lowercase | všechna písmena se převedou na malá |
Vlastnost text-transform ovlivňuje pouze zobrazení. Samotný text ve zdroji samozřejmě ovlivněný nebude. Jedná se o téměř zbytečnou vlastnost, zejm. hodnota capitalize je dost drsná :-)
Podpora
| Prohlížeč | Podpora ve verzích | Poznámka |
|---|---|---|
| Internet Explorer | všechny verze | |
| Firefox | všechny verze | |
| Opera | všechny verze | |
| Chrome | ano |
Příklady
<h2 style="text-transform:uppercase;">Nějaký nadpis</h2>
se zobrazí jako NĚJAKÝ NADPIS. Pokud se ten text bude kopírovat a vkládat, opět se objeví malými.
Eliminace lennosti
Máte-li nekvalitně udržovaný text, zejména menu se střídavě velkými a malými počátečními písmeny, můžete si usnadnit unifikaci. Hodí se na to pseudoelement first-letter. Dejme tomu, že mám texty v prvcích li:
<ul>
<li>text s malým na začátku</li>
<li>Text s velkým na začátku</li>
</ul>
Patřičný styl to vyřeší:
<style>
li:first-letter {text-transform: capitalize;} /* nebo uppercase */
</style>
Všechna začáteční písmena pak budou velkými. (Testováno v Exploreru 6.)
Zobrazit tento příkald: Sjednocení velikosti začátečních písmen
Reklama
