Proprietatea font-family

Proprietatea font-family stabilește tipul fontului.

Sintaxă

selector {
	font-family: numele fontului;
}

Observație

Dacă numele fontului conține spații, de exemplu, Times New Roman, acesta trebuie să fie inclus în ghilimele simple sau duble.

Observație

Puteți enumera mai multe fonturi similare separate prin virgulă. Când browserul întâlnește primul font din listă, verifică prezența lui pe computerul utilizatorului. Dacă un astfel de font nu există, este luat următorul font din listă și, de asemenea, este analizat prezența. Prin urmare, mai multe fonturi măresc probabilitatea ca cel puțin unul dintre ele să fie găsit pe computerul client.

Lista se încheie de obicei cu un cuvânt cheie, care descrie tipul de font (toate fonturile aparțin unui anumit tip) - serif, sans-serif, cursive, fantasy sau monospace. Dacă browserul nu găsește niciunul dintre fonturile specificate pe computerul utilizatorului, atunci acesta va alege unul dintre fonturile tipului specificat.

Tipuri de fonturi

Tip	Descriere
`serif`	Font cu serife.
`sans-serif`	Font fără serife.
`cursive`	Font cursiv.
`fantasy`	Font decorativ cu volute frumoase și efecte neobișnuite.
`monospace`	Font monospațial, în care lățimea fiecărui caracter este aceeași.

Valoarea implicită: fontul stabilit în browser în mod implicit. De obicei, acesta este Times New Roman.

Exemplu

Să atribuim fontului familia Arial:

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

p {
	font-family: Arial;
}

Exemplu

Să atribuim fontului familia Times New Roman. Deoarece numele fontului este format din mai multe cuvinte, îl punem în ghilimele:

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

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

Exemplu

Să atribuim fontului un font din grupul serif (cel mai probabil va fi ales Times New Roman):

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

p {
	font-family: serif;
}

Exemplu

Să atribuim fontului un font din grupul sans-serif (cel mai probabil va fi ales Arial):

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

p {
	font-family: sans-serif;
}

Exemplu

Să atribuim fontului un font din grupul fantasy (la dvs. este posibil să nu funcționeze din cauza absenței unui astfel de font):

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

p {
	font-family: fantasy;
}

Exemplu

Să atribuim fontului un font din grupul monospace (literele vor deveni de aceeași dimensiune):

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

p {
	font-family: monospace;
}