Rodina písma
V této lekci se postaráme o text na naší stránce: o jeho písmo, velikost, tloušťku, řádkování a zarovnání.
Z kurzu HTML znáte prvky strong a em. Ty dávají textu význam: strong označuje důležitý text a em text, na který klademe důraz. Prohlížeče je ve výchozím stavu zobrazují tučně a kurzívou, o vzhledu textu ale rozhoduje CSS. Pomocí CSS můžeme ztučnit nebo napsat kurzívou jakýkoli text a můžeme také změnit, jak vypadají strong a em.
Písmo vybíráme vlastností font-family (rodina písma). Rodina písma je jedno písmo se všemi svými řezy (variantami): například rodina Arial má obyčejný a tučný řez, kurzívu a tučnou kurzívu. Prohlížeč může použít jen písma, která jsou nainstalovaná v zařízení návštěvníka (nebo písma stažená spolu se stránkou, k nimž se dostaneme na konci této lekce). Proto je hodnotou font-family seznam písem oddělených čárkami: prohlížeč použije první písmo ze seznamu, které má k dispozici.
p {
font-family: Verdana, Arial, sans-serif;
}Tady prohlížeč nejdřív zkusí písmo Verdana. Pokud v zařízení nainstalované není, zkusí Arial. A pokud chybí i Arial, použije své výchozí bezpatkové písmo.
sans-serif není název písma, ale obecné rodiny písma: celého druhu písem. Prohlížeč má pro každou obecnou rodinu nějaké písmo, proto seznam vždy zakončíme jednou z nich. Nejdůležitější obecné rodiny jsou:
serif(patkové písmo): písmena mají na koncích tahů malé příčné čárky (patky), jako v knihách,sans-serif(bezpatkové písmo): písmena bez patek, jednoduchá a čistá,monospace(neproporcionální písmo): všechna písmena jsou stejně široká, jako v kódu.
Když název písma obsahuje mezery, je nejlepší ho napsat do uvozovek: "Times New Roman". Obecnou rodinu ale do uvozovek nikdy nepište: "sans-serif" v uvozovkách znamená písmo s názvem sans-serif, a takové neexistuje.
Písmo se dědí, proto ho nastavíme prvku body a dostane ho všechen text na stránce. Některým prvkům, třeba nadpisům, pak můžeme dát jiné písmo.
Jak psát:
"
{
}
#
Pokyny
Do pravidla pro body přidejte deklaraci font-family: Arial, sans-serif.
Do pravidla pro h2 přidejte deklaraci font-family: Georgia, "Times New Roman", serif.
Začněte programovat zdarma
1/8