font-familySvojstvo definira font koji se primjenjuje na odabranu elementa. Odabrani font nije lice s jednim fontom, već je "obitelj", pa stoga može ovisiti o ostalim vrijednostima tipografskih svojstava za odabir ispravnog lica unutar obitelji.
body ( font-family: Arial, Helvetica, sans-serif; )Vrijednost može biti jedno od sljedećeg:
- Prezime obitelji fontova koje odgovara fontu koji je ugrađen na stranicu ili dostupan u korisnikovom sustavu.
- Niz obiteljskih imena odvojenih zarezima koji mogu uključivati generičko prezime
Ako se koristi više obiteljskih imena, preglednik će odabrati prvo koje pronađe ugrađeno na stranicu pomoću @font-faceili instalirano u korisničkom operacijskom sustavu.
Jer font-familynema određene zadane ili početne vrijednosti; početna vrijednost uvijek ovisi o pregledniku i / ili operativnom sustavu.
Generička obiteljska imena
Ako se za jednu deklaraciju koristi više vrijednosti, preporučuje se da generička obitelj bude posljednja navedena kao zamjenska kako bi se osiguralo najbolje tipografsko iskustvo:
code ( font-family: Courier, Monaco, monospace; )U gornjem primjeru, "Courier" i "Monaco" stvarna su obiteljska imena stvarnih fontova, dok je "monospace" samo generička referenca na bilo koji font instaliran na korisnikovom sustavu koji je jednoprostorni.
Ako prva dva nisu instalirana, preglednik će odabrati najbolju opciju, ali samo iz monospace fontova. Bez generičke obitelji, font bi zadao ono što je zadani font u korisnikovom sustavu (vjerojatno serif ili sans-serif), što bi bilo nepoželjno.
Generički prezimena su serif, sans-serif, cursive, fantasy, i monospace.
Ako se obiteljsko ime podudara s generičkim obiteljskim imenom, treba navesti obiteljsko ime kako bi se naznačilo da nije generičko.
Obiteljska imena s više riječi
Ako obiteljsko ime sadrži više riječi, odvojenih razmacima, preporučuje se navođenje obiteljskog imena u navodnicima (jednostrukim ili dvostrukim):
code ( font-family: "Times New Roman", Georgia, serif; )To nije uvijek potrebno, ali općenito je sigurnije navodnike navoditi za svako prezime koje ima razmake ili posebne znakove.
Podrška preglednika
| Krom | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Djela | Djela | Djela | Djela | Djela | Djela | Djela |