Syntaxe vlastností rodiny písma
Typografický design je kriticky důležitým dílem úspěšného designu webových stránek. Vytváření stránek s textem, který je snadno čitelný a který vypadá skvěle, je cílem každého odborníka na web design. Chcete-li to dosáhnout, budete muset mít možnost nastavit konkrétní písma, která chcete použít na svých webových stránkách. Chcete-li zadat typ písma nebo rodinu písma ve vašich webových dokumentech, použijete ve svém CSS vlastnost písma a rodiny.
Nejjednodušší styl písma a rodiny, který můžete použít, by zahrnoval pouze jednu rodinu písma:
p {font-family: Arial; }}Pokud jste použili tento styl na stránku, budou všechny odstavce zobrazeny v rodině fontů "Arial". To je skvělé a protože "Arial" je to, co je známé jako "web-safe font", což znamená, že většina (ne-li všichni) počítač by jej nainstalovali, můžete si odpočinout velmi snadno vědět, že se vaše stránka zobrazí v zamýšleném písmu .
Co se stane, pokud vybrané písmo nemůže být nalezeno? Pokud například nepoužíváte na stránce stránku "bezpečné písmo", co udělá uživatelský agent, pokud nemá toto písmo? Střídají se.
To může mít za následek některé velmi vtipné stránky. Jednou jsem šel na stránku, kde byl počítač zobrazen úplně v "Wingdings" (sady ikon), protože počítač neměl písmo, které vývojář zadal a můj prohlížeč udělal velice špatnou volbu v tom, jaký font by použít jako náhradu. Stránka byla pro mě úplně nečitelná! Toto je místo, kde do hry vstupuje zásobník fontů.
Oddělit vícenásobné rodiny písem s čárkou v zásobníku písem
"Složka písma" je seznam písem, které chcete použít pro vaši stránku. Byl byste mít možnost volby písma v pořadí podle vašich preferencí a oddělovat je čárkou. Pokud prohlížeč nemá v seznamu první rodinu písma, zkusí druhou a potom třetí a tak dále, dokud nenajde jednu ze souborů v systému.
font-family: Pussycat, Alžír, Broadway;Ve výše uvedeném příkladu prohlížeč nejprve vyhledá písmo "Pussycat", pak "Alžírský" a poté "Broadway", pokud nebylo nalezeno žádné jiné písmo. Tím získáte větší šanci, že bude použito alespoň jedno z vybraných písem. Není to dokonalé, což je důvod, proč máme ještě více, které můžeme přidat do našeho zásobníku fontů (přečtěte si!).
Použijte poslední generické písma
Takže můžete vytvořit zásobník písem se seznamem písem a stále nemáte žádný, který prohlížeč najde. Zřejmě nechcete, aby se vaše stránka zobrazovala nečitelná, pokud prohlížeč provede špatnou náhradu. Naštěstí má CSS řešení i toto: obecná písma .
Vždy byste měli ukončit seznam písem (i když je to seznam jedné rodiny nebo pouze písma bezpečných pro web) s obecným písmem. Existuje pět, které můžete použít:
- kurzívní
- fantazie
- monospace
- sans-serif
- serif
Dva výše uvedené příklady mohou být změněny na:
font-family: Arial, sans-serif; font-family: Pussycat, Alžír, Broadway, fantasy;Některé názvy rodových rodů jsou dvě nebo více slov
Pokud je rodina písma, kterou chcete použít, více než jedno slovo, měli byste ji obklopit pomocí dvojitých uvozovek. Zatímco některé prohlížeče dokáží číst rodiny písem bez uvozovek, mohou se vyskytnout problémy, pokud je mezera zkreslená nebo ignorována.
font-family: "Times New Roman", serif;V tomto příkladu vidíte, že název písma "Times New Roman", který je vícečetný, je obsažen v uvozovkách. To řekne prohlížeču, že všechna tři slova jsou součástí tohoto názvu písma, na rozdíl od tří různých písem všech s jednojmennými jmény.
Původní článek Jennifer Krynin. Upraveno dne 12/2/16 od Jeremyho Girarda