Písma v CSS

Pomocí CSS lze nastavit rodinu, styl, duktus (tloušťku), velikost a variantu písma.

Popis všech vlastností písma je shrnut v přehledných tabulkách.

Rodina písma - font-family

Rodina písma umožňuje nastavit k jakémukoliv elementu seznam písem jako hodnota se uvádí seznam písem. Pokud prohlížeč nebude mít k dispozici první písmo použije druhé písmo pokud nebude k dispozici ani druhé použije třetí a pokud ani teď nenalezne požadované písmo zobrazí standardní písmo.

Nejčastěji používané seznamy písem jsou v seznamu, můžete se podívat i na popis všech písem.

Příklad

V následujícím příkladu je pro celou stránku nastaveno písmo Arial pokud písmo z nějakého důvodu nepůjde zobrazit zobrazí se druhé, nebo třetí.

body{font-family : Arial, Helvetica, sans-serif;}

Styl písma - font-style

Pomocí vlastnosti font-style se může nastavit styl písma a to buď kurzíva (font-style:italic) nebo skloněné písmo(font-style:oblique).

Možné hodnoty k nastavení stylu písma.

Příklad

Podle následujícího příkladu se odstavce s třídou kurziva (p class="kurziva") zobrazí kurzívou.

p.kurziva{font-style : italic;}

Varianta písma - font-variant

Varianta písma umožňuje nastavit kapitálky nebo normální písmo(kapitálky to jsou velká písmena).

Možné hodnoty k nastavení varianty písma.

Příklad

Podle příkladu všechny odstavce s třídou kapital se zobrazí kapitálkami (velkými písmeny).

p.kapital{font-variant : small-caps; }

Duktus (tloušťka) písma - font-weight

Vlastnost font-weight nastavuje duktus písma (to znamená jak bude písmo silné). Písmo může být tlusté (bold), tlustší (bolder)nebo i tenčí (lighter).

Možné hodnoty k nastavení tloušťky písma.

Příklad

Podle následujícího příkladu se odstavce s třídou tucne zobrazí tučným písmem.

p.tucne{font-weight : bolder;}

Velikost písma - font-size

Pro nastavení velikosti písma doporučuji používat délkové jednotky. Pokud chcete aby šlo písmo zvětšovat používejte jednotku em jako v příkladu pokud budete chtít velikost nezvětšovací použijte pixely px a na tiskový výstup se nejvíce hodí jednotka pt.

Možné hodnoty k nastavení velikosti písma.

Příklad

Podle příkladu se odstavce zobrazí písmem o velikost 0.8em.

p{font-size : 0.8em;}

Reklama

Webhosting C4



Copyright (c) 2004 Tvorba Webu - Kontakt - mapa webu - RSS