font-familyVlastnosť definuje písmo, ktorý je aplikovaný na vybraný prvok. Vybrané písmo nie je jedna tvár písma, ale „rodina“, a preto môže byť pri výbere správnej tváre v rámci rodiny závislé od iných hodnôt typografických vlastností.
body ( font-family: Arial, Helvetica, sans-serif; )Hodnota môže byť jedna z nasledujúcich:
- Názov rodiny písma, ktorý sa zhoduje s písmom, ktoré je vložené na stránke alebo dostupné v systéme používateľa.
- Rad priezvisk oddelených čiarkami, ktoré môžu obsahovať aj všeobecné priezvisko
Ak sa použije viac priezvisk, prehľadávač vyberie prvé, ktoré nájde buď vložené na stránke pomocou @font-facealebo nainštalované v operačnom systéme používateľa.
Pretože font-familyneexistuje žiadna konkrétna predvolená alebo počiatočná hodnota; počiatočná hodnota vždy závisí od prehliadača alebo operačného systému.
Generické rodinné mená
Ak sa v jednej deklarácii použije viac hodnôt, odporúča sa mať ako alternatívu ako poslednú záložnú položku generickú rodinu:
code ( font-family: Courier, Monaco, monospace; )Vo vyššie uvedenom príklade sú výrazy „Courier“ a „Monaco“ skutočné priezviská skutočných typov písma, zatiaľ čo výraz „monospace“ je iba všeobecným odkazom na akékoľvek písmo nainštalované v systéme používateľa s nepriechodnými priestormi.
Ak sa prvé dva nenájdu nainštalované, prehliadač vyberie najlepšiu možnosť, ale iba z jednopriestorových písiem. Bez generickej rodiny by písmo malo predvolené predvolené písmo v systéme používateľa (pravdepodobne pätkové alebo bezpätkové), čo by bolo nežiaduce.
Generické priezvisko zahŕňajú serif, sans-serif, cursive, fantasya monospace.
Ak sa priezvisko zhoduje s všeobecným priezviskom, malo by sa uviesť, aby naznačovalo, že nejde o druhové meno.
Viacslovné rodinné mená
Ak priezvisko obsahuje viac slov oddelených medzerami, odporúča sa uviesť priezvisko v úvodzovkách (jednoduchých alebo dvojitých):
code ( font-family: "Times New Roman", Georgia, serif; )Nie je to vždy potrebné, ale všeobecne je bezpečnejšie zahrnúť úvodzovky každého priezviska, ktoré obsahuje medzery alebo špeciálne znaky.
Podpora prehľadávača
| Chrome | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Tvorba | Tvorba | Tvorba | Tvorba | Tvorba | Tvorba | Tvorba |