CSS (7.) - Písmo II. (Tloušťka písma)

V minulém díle jsme se seznámili, jak nastavit výšku písma. Dnes si ukážeme, jak nastavit pomocí kaskádových stylů tloušťku písma.

30.8.2004 13:00 | Vasek | přečteno 19638×

Tloušťka písma

Tloušťka písma (duktus písma) se určuje vlastností font-weight. Jako její hodnota se používají klíčová slova nebo číselné hodnoty.

font-weight
Hodnoty: <absolutní-velikost> | <relativní-velikost> | <velikost> | inherit
Výchozí hodnota: normal
Ovlivňuje: všechny prvky
Dědičná: ano
Procenta: nelze používat
Média: vizuální
  <absolutní-velikost> normal | bold
  <relativní-velikost> bolder | lighter
  <velikost> 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
  inherit hodnota se dědí po rodičovském prvku

Existují dva názory na tuto vlastnost písma:
  1) Aby mohl prohlížeč vykreslit písmo příslušné tloušťky, je potřeba, aby tato tloušťka byla přímo součástí definice fontu.
  2) Prohlížeče můžou různé tloušťky písma vytvořit uměle.

Hodnota normal nastaví tloušťku písma na netučné, lze použít k odtučnění písma prvků, u kterých mají prohlížeče přednastavené tučné písmo (např. u nadpisů <h1> - <h6>).

Příklad:

<style>
  h2 {font-weight: normal}
</style>

Relativní hodnoty změní o něco málo tloušťku písma, která je zděděná z rodičovského prvku. Při použití bolder bude písmo o něco tučnější, pokud použijeme lighter, bude písmo o něco méně tučnější, pomocí této hodnoty nelze nastavit menší tloušťku než normal.

Hodnoty 100 - 900 by se podle W3C měli používat jen výjmečně, resp. by se měli používat jen hodnoty 400 (odpovídá normal) a hodnota 700 (odpovídá bold).

Podpora v prohlížečích

Ve všech prohlížečích jsou podporovány hodnoty normal a bold, což je podstatné.

NN4 nepodporuje hodnoty bolder a lighter; Mozilla (Netscape 6+) plná podpora všemi verzemi; IE plná podpora od verze 3; Opera plná podpora od verze 3; IE 5/MAC plná podpora; Konqueror plná podpora.

Příklady tloušťky

font-weight: normal
font-weight: bold
font-weight: bolder
font-weight: lighter
font-weight: 100
font-weight: 200
font-weight: 300
font-weight: 400
font-weight: 500
font-weight: 600
font-weight: 700
font-weight: 800
font-weight: 900

Závěr

Vlastnost písma font-weight se používá nejčastěji k nastavení tučného písma pomocí hodnoty bold, a tím se nahrazuje zastaralý html tag <b>. V následujícím díle se podíváme na další vlastnosti písma.

Online verze článku: http://www.linuxsoft.cz/article.php?id_article=372