Dnes se blíže podíváme na to, jaké typy písma nám HTML dovoluje v textu vyznačit.
24.6.2004 15:00 | Pavel Kácha | přečteno 46685×
Typem písma vyznačujeme na stránce tu část textu, která buď má speciální obsah, který chceme od zbytku stránky nějak odlišit (např.: zdrojový kód), nebo má obsah, pro který není značka, ale my tento text chceme nějak odlišit. Typy písma se dělí na dvě velké skupiny:
Logické styly májí speciální obsah, který je logicky odlišuje od zbytku stránky (v každém prohlížeči se mohou zobrazit jinak), fyzické styly používáme spíše pro větší přehlednost textu (ve všech prohlížečích by se měly zobrazit stejně).
Všechny značky, které patří do logických stylů, jsou párové a je u nich nutné uvádět i ukončovací tag. V následující tabulce najdete přehled tagů pro logické styly.
Tagy pro logické styly | ||
Tag | Význam | Zformatovany text |
<em></em> | Obsah tagu chceme zdůraznit | Důležitý text |
<strong></strong> | Obsah tagu chceme silně zdůraznit | Důležitější text |
<cite></cite> | Tímto tagem se označuje citace | Citát z jiného zdroje |
<dfn></dfn> | Označuje právě definovaný termín | Definovaný termín |
<code></code> | Označuje výpis zdrojového kódu nebo HTML | printf("Hello world."); |
<samp></samp> | Výstup z programů a scriptů | exit - error 3 |
<kbd></kbd> | Ozančení textu zadaného uživatelem | ls -la |
<var></var> | Označuje v textu proměnné | $pomocna_promenna |
<abbr></abbr> | označuje zkratku | WWW |
<acronym></acronym> | označuje akronym | radar |
Stejně jako u logických stylů jsou i u fyzických stylů všechny tagy párové a je u nich nutné uvádět i ukončovací tag. Následující tabulka obsahuje přehled tagů pro logické styly.
Tagy pro fyzické styly | ||
Tag | Význam | Zformatovany text |
<tt></tt> | Neproporcionální písmo | Text jako z psacího stroje |
<i></i> | Kurzíva | Text psaný kurzívou |
<b></b> | Tučný text | Text psaný tučně |
<big></big> | Velké písmo | Velké písmo |
<small></small> | Malé písmo | Malé písmo |
<strike></strike> | Přeškrtnutý text | |
<s></s> | Přeškrtnutý text - tento tag už by se neměl používat, v novějších verzích nebude podporován | |
<u></u> | Podtržený text - tento tag už by se neměl používat, v novějších verzích nebude podporován | Podtržený text |
Atributy jsou u typů písma povoleny stejné jako u odstavců, jedinou vyjímkou je atribut pro zarovnání align:
Atribut | Hodnota | Význam |
id | libovolný text | Hodnotou atributu je text (znakový řetězec), který je jednoznačným identifikátorem prvku v dokumentu. Tento atribut využijete třeba při oživování stránek pomocí JavaScriptu. |
class | libovolný text | Hodnotou atributu je třída definovaná v tabulce prvků CSS, podle které se prvek zformátuje. |
lang | zkratky označující jazyk, např.: en, cz, sk | Hodnotou atributu určujeme jazyk, kterým je psaný obsah odstavce. Podle zvoleného jazyka se aktivují různé konvence používané v konkrétních jazycích (např.: francouzské uvozovky). |
dir | rtl | Určuje směr textu zprava doleva. |
ltr | Určuje směr textu zleva do prava. | |
title | libovolný text | Určuje titulek odstavce, který se v některých prohlížečích zobrazí jako bublinková nápověda po najetí kurzoru na odstavec (hojně využívané u akronymů :) ). |
style | příkazy jazyka CSS, např. color : red; | Pomocí tohoto atributu můžete nadefinovat, jak se má zobrazit určitý logický styl . Můžete využít všechny možnosti, které CSS nabízí. |
Samozřejmě nesmí chybět ani atributy využitené v kombinaci s JavaScriptem:
Povolené atributy spojené s JS v logických stylech | |
Atribut | Význam |
onclick | Příkazy zadané jako hodnota proběhnou při kliknutí na element |
ondblclick | Příkazy zadané jako hodnota proběhnou při dvojkliku na element |
onmousedown | Příkazy zadané jako hodnota proběhnou při stisku tlačítka myši na element |
onmouseup | Příkazy zadané jako hodnota proběhnou po stisku tlačítka myši (po uvolnění tlačítka) na element |
onmouseover | Příkazy zadané jako hodnota proběhnou při přejetí kurzoru nad elementem |
onmousemove | Příkazy zadané jako hodnota proběhnou při pohybu kurzoru nad elementem |
onmouseout | Příkazy zadané jako hodnota proběhnou poté, co kurzor opustí prostor nad elementem |
onkeypress | Příkazy zadané jako hodnota proběhnou při stisku klávesy na klávesnici |
onkeydown | Příkazy zadané jako hodnota proběhnou při pohybu klávesy dolů (událost nastane ještě před úplným stisknutím klávesy) |
onkeyup | Příkazy zadané jako hodnota proběhnou při pohybu klávesy nahoru (událost nastane až při návratu klávesy do nestisknutého stavu) |