Introducere în Web Development

Capitolul 3: Introducere în CSS
Proprietăți de tipografie

font-family

Prin proprietatea font-family se setează numele fontului folosit pe acel element.

Se poate folosi un font specific, dar trebuie să fie deja instalat pe calculatorul utilizatorului.

Se pot folosi fonturi web, care sunt definite în CSS.
Personal, nu mă joc foarte mult cu font-urile web. Designerii au fonturi preferate, de ei sau de companie, iar eu le includ în site folosind @font-face.

Se mai pot da și nume de fonturi generice, precum: serif, sans-serif, curisive, monospace. Acestea vor fi traduse de browser într-un font instalat deja pe calculatorul utilizatorului.

De obicei, se dă o listă de font-uri, separate prin virgulă. Browserul va încerca să încarce pe rând fiecare font, până găsește unul funcțional.

                    font-family: 'Times New Roman', Times, serif;
                

font-size

Prin proprietatea font-size se dimensionează textul.

Se pot folosi mărimi standard, dar și cuvinte cheie precum: small, medium, large, xx-small, x-large, xxx-large.

Dacă mărimea se dă ca procent, fontul se dimensionează în funcție de mărimea fontului părintelui elementului.
În același scop, mai pot fi folosite cuvintele smaller și larger

Conținutul continuă după reclamă

line-height

Prin proprietatea line-height se setează cât de mare este o linie de text.

Se pot folosi mărimi standard, procente, un număr fără unitate.

Numărul fără unitate sau procentul va fi înmulțit cu mărimea fontului. Așadar, valori între 0 (0%) și 1 (100%) vor face linia să fie mai mică decât fontul.

font-weight

Proprietatea font-weight îți permite să te joci cu grosimea textului.

ValoareValoare
normalText normal, neîngroșat, nesubțiat
boldText îngroșat
100Text mai subțire.
200Text mai subțire.
300Text mai subțire.
400Text normal, neîngroșat, nesubțiat
500Diferite nivele de îngroșare
600Diferite nivele de îngroșare
700Text îngroșat
800Mai mult decât îngroșat
900Mai mult decât îngroșat

Deși unele valori arată ca numere, nu se pot folosi alte numere decât cele de mai sus. Adică nu se pot folosi valori precum 359.

Trebuie să ai grijă ca fontul pe care îl folosești să permită grosimea aleasă.

font-style

font-style îți permite să faci text înclinat.

Valoare
italicînclinat
obliqueînclinat altfel (în unele font-uri)
normal Font resetat.
Designed by