Tabulka si klade za cíl v jednom řádku ukazovat deklarace, které zobrazí na pohled stejně velké písmo. Liší se to podle prohlížeče. V tabulkách jsou zadány ostré kódy, dá se na nich testovat.
| <font size=""> | font-size: slovo | font-size: pixely | tagy, nadpisy |
|---|---|---|---|
| size=1 | font-size: xx-small | font-size: 10px |
h6 |
| size=2 | font-size: x-small | font-size: 13px |
h5 |
| size=3 | font-size: small | font-size: 16px | běžný text, h4 |
| size=4 | font-size: medium | font-size: 18px |
h3 |
| size=5 | font-size: large | font-size: 24px |
h2 |
| size=6 | x-large | font-size: 30px |
h1 |
| zvětšovací | zvětšovací | nelze v Exploreru zvětšovat | zvětšovací |
Velikosti odpovídají, pokud je velikost písma v prohlížeči nastavena na střední. (Zobrazit > Velikost písma > Střední.) Velikosti zadané v pixelech se v Exploreru nezvětší. Nestandardní mód má Explorer do verze 5.5 a ve verzi 6 bez striktního !doctype. Tento soubor doctype nemá, protože schválně užívá nestandardní kódy. Opera zřejmě také má standardní a nestandardní mód, ale neznám moc podrobností.
30px u x-large jsem neměřil, ale odhadl.
| <font size=""> | font-size: slovo | font-size: pixely | tagy, nadpisy |
|---|---|---|---|
| font-size: xx-small | font-size: 9px | ||
| size=1 | font-size: x-small | font-size: 10px |
h6 |
| size=2 | font-size: small | font-size: 13px |
h5 |
| size=3 | font-size: medium | font-size: 16px | běžný text, h4 |
| size=4 | font-size: large | font-size: 18px |
h3 |
| size=5 | x-large | font-size: 24px |
h2 |
| zvětšovací | zvětšovací | nelze v Exploreru zvětšovat | zvětšovací |
Testováno pouze na Windows, ale předpokládám funkčnost i jinde. Nejsem si jist tou osmnáctkou, možná je to v Mozille devatenáctka.
Chcete-li, aby Internet Explorer 6 nebo Opera 7 zobrazovaly tabulku se souhlasnými řádky, přidejte na začátek souboru striktní deklaraci typu dokumentu, například:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN">
Tím se prohlížeč přepne do striktního módu.
V Mozille je defaultně nastavena velikost proporcionálního písma na 16 pixelů, ale uživatel si to může změnit. Edit > Preferences > Apearance > Fonts. Též si může zobrazení zvětšit nebo zmenšit -- View > Zoom. Narozdíl od Exploreru se přitom zvětšují i písmena zadaná v pixelech.
V Opeře se dá ve File > Preferences navolit vlastní velikost písma pro každý prvek, ale asi to dělá málokdo. View > Zoom zvětšuje dokument včetně písem zadaných v pixelech.
Standardní mód vykresluje relativně zadaná písma o jeden stupeň menší, než nestandardní mód. Jenom pixely se vykreslují stejně velké. Ty zase nejdou uživatelům v Exploreru zvětšovat.
Chcete-li mít ve stránce stejně velké zvětšovací písmo v nestandardním (většinou Explorer) i standardním prohlížeči, dá se to hacknout různými způsoby. Já nejraději používám uvozovky, které standardní režim nepobere. Např. tohle bude mít ve většině případů 16 pixelů:
p {font-size: middle}/* pro standardní i nestandardní */
p {font-size: "small"}/* standardní nechápe a ignoruje, nestandardní bere,
protože to dostal později */
Důležitá poznámka: Explorer 6 ve standardním módu uvozovky ignoruje.
Jiný způsob hackování pomocí zpětného lomítka je navíc validní. Pozor, vyžaduje opačné pořadí zápisu:
p {font-size: small}/* pro standardní i nestandardní */
p {fo\nt-size: middle}/* pro standardní (dostanou to později), nestandardní to
nechápou*/
Zpětné lomítko před písmenkem způsobí, že nestandardní režimy zápis vlastnosti nepochopí. Explorer 6 ve standardním režimu to pochopí.
Na Windows platí 4px = 3pt aneb 96px = 72pt, protože ve Windows je defaultně nastaveno rozlišení 96 ppi (pixels per inch, často se to zaměňuje s dpi). Dá se to přenastavit ve Vlastnosti Zobrazení (pravoklik na ploše, vlastnosti) > Nastavení > Upřesnit. Mac má výchozí rozlišení 72 ppi, taky se dá přenastavit, nevím jak. Rozlišení linuxových iXů neznám, asi to bude taky 96 ppi.
Když se v HTML něco zadá bez jednotky, zpravidla to znamená pixely, px. To dost často zmate lidi zvyklé pracovat ve Wordu nebo tak, kde je všechno v typografických bodech pt.
Vizte též: Délkové jednotky v CSS, Webově použitelná písma -- přehled, Různý styl v různých prohlížečích