LINUXSOFT.cz Přeskoč levou lištu
Uživatel: Heslo:  
   CZUKPL

> CSS (6.) - Písmo I. (Velikost písma)

V dnešním díle se seznámíme, jak je možné nastavit pomocí kaskádových stylů velikost písma.

23.8.2004 13:00 | Vasek | Články autora | přečteno 17909×

Formátování textu pomocí CSS nám nabízí stejné možnosti, které poskytuje html tag <font>, a navíc je k dispozici mnoho dalších vlastností, které prostředky HTML nebylo možné vůbec popsat.

Velikost písma

Velikost písma se určuje vlastností font-size. Jako její hodnota se používají klíčová slova nebo číselné hodnoty s jednotkou, případně procenta.

font-size
Hodnoty: <absolutní-velikost> | <relativní-velikost> | <velikost> | <procenta> | inherit
Výchozí hodnota: medium
Ovlivňuje: všechny prvky
Dědičná: ano
Procenta: z velikosti písma rodičovského prvku
Média: vizuální
  <absolutní-velikost> xx-small | x-small | small | medium | large | x-large | xx-large
  <relativní-velikost> larger | smaller
  <velikost> číslo a jednotka viz díl č. 2
  <procenta> viz výše
  inherit hodnota se dědí po rodičovském prvku

Pro absolutní velikosti má klient definovanou tabulku velikostí písem. Specifikace CSS2 doporučuje klientům sestavit tuto tabulku tak, aby koeficient mezi jednotlivými stupni velikosti písma pro počítačovou obrazovku činil 1,2 (např. pokud je velikost písma medium rovna 12,2pt, tak velikost písma large má být 14,4pt). Jelikož se jedná jen o doporučení a v předcházející specifikaci CSS1 byl tento koeficient 1,5 (jež je vnímán jako příliž veliký), nelze se na to spoléhat. Pokud není velikost písma deklarována vůbec, použijí prohlížeče výchozí hodnotu medium.

Relativní velikosti (larger a smaller) jsou interpretovány jak vůči klientské tabulce velikostí písma, tak i vůči velikosti písma rodičovského prvku. Pokud měl rodičovský prvek velikost písma medium hodnota larger nastaví jeho velikost písma na large.

Podpora v prohlížečích

Současně používané prohlížeče obsahují několik chyb a odlišností v implementaci CSS, ačkoliv se na první pohled zdá, že tuto vlastnost podporují všechny bez větších problémů.

IE4 a NN4 zvládají bez problémů jen velikosti písem nastavených v pixelech (px). Absolutní velikosti (small, medium, large atd.) se zobrazují nepředvídatelně, a procentuální hodnoty jsou většinou nesprávně interpretovány jen z výchozí hodnoty (nikoliv z rodičovského prvku). Jednotku em interpretuje IE3 jako pixel (px).

Určování velikostí písem v pixelech činí problémy s čitelností stránek pod IE/Win, jelikož písmo nelze snadno uživatelsky zvětšovat. Absolutní velikosti určené pomocí klíčových slov (small, medium, large atd.) způsobují problémy ve starších verzích IE/Win, jelikož až do verze 5.5 (a i ve verzi 6 v režimu zpětné kompatibility, jež je zapnut vždy když není definován striktní typ dokumentu) zobrazuje písmo vždy o stupeň větší tj. xx-small jako x-small, x-small jako small, small jako medium atd.

Podpora ostatními prohlížeči: Mozilla (Netscape 6+) plná podpora všemi verzemi; Opera plná podpora od verze 3; IE 5/MAC plná podpora; Konqueror plná podpora.

Pokud chcete mít na stránce stejně veliké písmo v libovolném prohlížeči (v nestandardním řežimu {většinou Explorer} i standardním režimu) a také s možností jeho zvětšení, lze provést mnoho hacků, které to umožní. Jeden z nich je následující: použít uvozovky, které prohlížeč ve standardním režim ignoruje. Např. tohle bude mít ve většině případů 16 pixelů:

p {font-size: medium}
p {font-size: "small"}

Princip tohoto hacku spočívá v uvedení obou dvou předcházejících řádků pro definici velikosti písma jednoho prvku. Prvnímu řádku rozumí standardní i nestandardní režim prohlížeče a nastaví podle toho velikost písma. Druhému řádku s uvozovkami prohlížeč ve standardním režimu nerozumí, a proto jej ignoruje, kdežto prohlížeč v nestandardním režimu tomuto zápisu rozumí, a jelikož ho dostal jako druhý, přenastaví velikost písma podle této definice. Prohlížeč v nestandardním režimu automaticky zobrazuje písmo o velikost větší, což v našem případě je požadované medium.

Příklady velikostí

font-size: xx-small
font-size: x-small
font-size: small
font-size: medium
font-size: large
font-size: x-large
font-size: xx-large
font-size: 16px
font-size: 130%
font-size: 18pt
font-size: .25in
font-size: .5cm
font-size: 5mm
font-size: 1pc
font-size: 2em
font-size: 2ex

Závěr

V dalších dílech si postupně probereme další vlastnosti písma v kaskádových stylech.

Verze pro tisk

pridej.cz

 

DISKUZE

dalsi poctenicko 23.8.2004 16:53 Valis
pekny serial 27.8.2004 13:14 Petr Semelka




Příspívat do diskuze mohou pouze registrovaní uživatelé.
> Vyhledávání software
> Vyhledávání článků

14.11.2017 16:56 /František Kučera
Máš rád svobodný software a hardware nebo se o nich chceš něco dozvědět? Zajímá tě DIY, CNC, SDR nebo morseovka? Přijď na sraz spolku OpenAlt – tradičně první čtvrtek před třetím pátkem v měsíci: 16. listopadu od 18:00 v Radegastovně Perón (Stroupežnického 20, Praha 5).
Přidat komentář

12.11.2017 11:06 /Redakce Linuxsoft.cz
PR: 4. ročník odborné IT konference na téma Datová centra pro business proběhne již ve čtvrtek 23. listopadu 2017 v konferenčním centru Vavruška, v paláci Charitas, Karlovo náměstí 5, Praha 2 (u metra Karlovo náměstí) od 9:00. Konference o návrhu, budování, správě a efektivním využívání datových center nabídne odpovědi na aktuální a často řešené otázky, např Jaké jsou aktuální trendy v oblasti datových center a jak je využít pro vlastní prospěch? Jak zajistit pro firmu či jinou organizaci odpovídající služby datových center? Podle jakých kritérií vybrat dodavatele služeb? Jak volit součásti infrastruktury při budování či rozšiřování vlastního datového centra? Jak efektivně spravovat datové centrum? Jak eliminovat možná rizika? apod.
Přidat komentář

13.9.2017 8:00 /František Kučera
Máš rád svobodný software a hardware nebo se o nich chceš něco dozvědět? Zajímá tě DIY, CNC, SDR nebo morseovka? Přijď na sraz spolku OpenAlt – tentokrát netradičně v pondělí: 18. září od 18:00 v Radegastovně Perón (Stroupežnického 20, Praha 5).
Přidat komentář

3.9.2017 20:45 /Redakce Linuxsoft.cz
PR: Dne 21. září 2017 proběhne v Praze konference "Mobilní řešení pro business". Hlavní tématy konference budou: nejnovější trendy v oblasti mobilních řešení pro firmy, efektivní využití mobilních zařízení, bezpečnostní rizika a řešení pro jejich omezení, správa mobilních zařízení ve firmách a další.
Přidat komentář

15.5.2017 23:50 /František Kučera
Máš rád svobodný software a hardware nebo se o nich chceš něco dozvědět? Zajímá tě DIY, CNC, SDR nebo morseovka? Přijď na sraz spolku OpenAlt, který se bude konat ve čtvrtek 18. května od 18:00 v Radegastovně Perón (Stroupežnického 20, Praha 5).
Přidat komentář

12.5.2017 16:42 /Honza Javorek
PyCon CZ, česká konference o programovacím jazyce Python, se po dvou úspěšných ročnících v Brně bude letos konat v Praze, a to 8. až 10. června. Na konferenci letos zavítá např. i Armin Ronacher, známý především jako autor frameworku Flask, šablon Jinja2/Twig, a dalších projektů. Těšit se můžete na přednášky o datové analytice, tvorbě webu, testování, tvorbě API, učení a mentorování programování, přednášky o rozvoji komunity, o použití Pythonu ve vědě nebo k ovládání nejrůznějších zařízení (MicroPython). Na vlastní prsty si můžete na workshopech vyzkoušet postavit Pythonem ovládaného robota, naučit se učit šestileté děti programovat, efektivně testovat nebo si v Pythonu pohrát s kartografickým materiálem. Kupujte lístky, dokud jsou.
Přidat komentář

2.5.2017 9:20 /Eva Rázgová
Putovní konference československé Drupal komunity "DrupalCamp Československo" se tentokrát koná 27. 5.2017 na VUT FIT v Brně. Můžete načerpat a vyměnit si zkušenosti z oblasti Drupalu 7 a 8, UX, SEO, managementu týmového vývoje, využití Dockeru pro Drupal a dalších. Vítáni jsou nováčci i experti. Akci pořádají Slovenská Drupal Asociácia a česká Asociace pro Drupal. Registrace na webu .
Přidat komentář

1.5.2017 20:31 /Pavel `Goldenfish' Kysilka
PR: 25.5.2017 proběhne v Praze konference na téma Firemní informační systémy. Hlavními tématy jsou: Informační systémy s vlastní inteligencí, efektivní práce s dokumenty, mobilní přístup k datům nebo využívání cloudu.
Přidat komentář

   Více ...   Přidat zprávičku

> Poslední diskuze

5.12.2017 11:50 / Thomas
kitchen renovations

18.9.2017 14:37 / Rojas
high security vault

15.9.2017 7:33 / Wilson
new zealand childcare jobs

31.8.2017 12:11 / Jaromir Obr
Re: ukůládání dat ze souboru

30.7.2017 11:12 / Jaromir Obr
Národní znaky

Více ...

ISSN 1801-3805 | Provozovatel: Pavel Kysilka, IČ: 72868490 (2003-2017) | mail at linuxsoft dot cz | Design: www.megadesign.cz | Textová verze