Font-family īpašība

Īpašība font-family nosaka fonta tipu.

Sintakse

selektors {
	font-family: fonta nosaukums;
}

Piezīme

Ja fonta nosaukumā ir atstarpes, piemēram, Times New Roman, tas jāiekļauj vienpēdiņās vai pēdiņās.

Piezīme

Var uzskaitīt vairākus līdzīgus fontus atdalot tos ar komatu. Kad pārlūkprogramma saskaras ar pirmo fontu sarakstā, tā pārbauda tā esamību lietotāja datorā. Ja šāda fonta nav, tiek ņemts nākamais fonts no saraksta un arī analizēts uz esamību. Tāpēc vairāki fonti palielina iespējamību, ka vismaz viens no tiem tiks atrasts klienta datorā.

Sarakstu parasti beina ar atslēgvārdu, kas apraksta fonta tipu (visi fonti pieder kādam tipam) - serif, sans-serif, cursive, fantasy vai monospace. Ja pārlūkprogramma neatrada nevienu no norādītajiem fontiem lietotāja datorā, tad tā izvēlēsies vienu no norādītā tipa fontiem.

Fontu tipi

Tips	Apraksts
`serif`	Fonts ar serifiem (dekoratīvām līnijām).
`sans-serif`	Fonts bez serifiem.
`cursive`	Kursīva fonts.
`fantasy`	Dekoratīvs fonts ar skaistiem volūtiem un neparastiem efektiem.
`monospace`	Monospace fonts, kurā katra simbola platums ir vienāds.

Noklusējuma vērtība: fonts, kas iestatīts pārlūkprogrammā pēc noklusējuma. Parasti tas ir Times New Roman.

Piemērs

Piešķirsim fontam ģimeni Arial:

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: Arial;
}

Piemērs

Piešķirsim fontam ģimeni Times New Roman. Tā kā fonta nosaukums sastāv no vairākiem vārdiem, tad to ņemam pēdiņās:

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: "Times New Roman";
}

Piemērs

Piešķirsim fontam fontu no grupas serif (visticamāk tiks izvēlēts Times New Roman):

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: serif;
}

Piemērs

Piešķirsim fontam fontu no grupas sans-serif (visticamāk tiks izvēlēts Arial):

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: sans-serif;
}

Piemērs

Piešķirsim fontam fontu no grupas fantasy (pie jums var neizdoties, ja šāda fonta nav):

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: fantasy;
}

Piemērs

Piešķirsim fontam fontu no grupas monospace (burti kļūs vienāda izmēra):

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: monospace;
}