Stilizarea fonturilor

Familia de fonturi

Proprietatea font-family stabilește familia de fonturi care va fi utilizată. De exemplu:

body{
   font-family: Arial;
}

În acest caz, este stabilit fontul Arial.

Fontul proprietății font-family va funcționa doar dacă utilizatorul are același font pe computerul local. Din acest motiv, adesea sunt alese fonturi standard, care sunt larg răspândite, cum ar fi Arial, Verdana, etc.

De asemenea, este frecventă practica utilizării mai multor fonturi:

body{
   font-family: Arial, Verdana, Helvetica;
}

În acest caz, fontul principal este primul - Arial. Dacă acesta nu este suportat pe computerul utilizatorului, atunci se alege al doilea și așa mai departe.

Dacă numele fontului este format din mai multe cuvinte, de exemplu, Times New Roman, atunci întregul nume este pus între ghilimele:

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

Pe lângă stilurile specifice pot fi utilizate și fonturi universale generale, stabilite prin valori sans-serif și serif:

body{
   font-family: Arial, Verdana, sans-serif;
}

Astfel, dacă nici Arial, nici Verdana nu sunt suportate pe computerul utilizatorului, atunci se folosește sans-serif - un font universal fără serife.

Fonturi cu serife

Fonturile cu serife sunt denumite așa pentru că la capetele principalelor linii au mici extensii. Se consideră că acestea sunt potrivite pentru blocuri mari de text, deoarece vizual leagă o literă de alta, făcând textul mai lizibil.

Fonturi comune cu serife: Times, Times New Roman, Georgia, Garamond. Fontul generalizat universal cu serife este reprezentat de valoarea serif.

Fonturi fără serife

Spre deosebire de fonturile cu serife, fonturile din această categorie nu au serife. Cele mai comune fonturi din acest grup sunt: Arial, Helvetica, Verdana.

Fonturi monospațiale

Fontul monospațial este folosit predominant pentru afișarea codului de programare și nu este destinat pentru redarea textului standard al articolelor. Aceste fonturi au primit numele lor deoarece fiecare literă într-un astfel de font are aceeași lățime. Exemple de astfel de fonturi sunt: Courier, Courier New, Consolas, Lucida Console.

Exemple de fonturi:

Grosimea fontului

Proprietatea font-weight stabilește grosimea fontului. Ea poate lua 9 valori numerice: 100, 200, 300, 400,...900. 100 - font foarte subțire, 900 - font foarte gros.

În realitate, pentru această proprietate sunt folosite mai des două valori: normal (text obișnuit nengroșat) și bold (font semigros):

font-weight: normal;
font-weight: bold;

Proprietatea font-style

Proprietatea font-style permite evidențierea textului în cursiv. Pentru acest lucru se utilizează valoarea italic:

p {font-style: italic;}

Dacă este necesar să se anuleze cursivul, se aplică valoarea normal:

p {font-style: normal;}

Culoarea fontului

Proprietatea color stabilește culoarea fontului:

p {
   color: red;
}