Exiled - Gaming Romania este o comunitate bazata pe gaming-ul profesionist.


Tutorial Fonturi

 



Vezi subiectul anterior Vezi subiectul urmator In jos   Mesaj • Pagina 1 din 1

мädáℓïη
#1

Dum Mar 10, 2013 9:01 am

мädáℓïη
Exiled Skill +4
Exiled Skill +4
[bE]xista doua tipuri principale de fonturi si anume "serif" si "sans serif". Intre ele nu este mare diferenta dar ceea ce este de retinut este ca: fonturile familiei "serif" sunt mai usor de citit.

Pentru a specifica fontul cu ajutorul CSS-ului vom folosi codul urmator

Cod:
p { font-family: "Times New Roman",Georgia,Serif; }


Dupa cum se poate observa se pot prestabili mai multe fonturi in cazul in care userul nu are instalat fontul principal, sau browser-ul nu suporta fontul respectiv.

font style si font weight

Font style si font weight in CSS se refera la text normal, inclinat sau ingrosat.

Cod:
p { font-style: normal; }
p { font-style: italic; }
p { font-weight: bold; }


Sunt si alte valori pe care le pot lua atat font style cat si font weight dar cele de mai sus sunt cele care se folosesc in mod normal in CSS. Am ajaugat totusi o lista cu toate valorile acceptate ceva mai jos.

Marimea textului

Pentru a stabili marimea textului cu ajutorul CSS-ului vom folosii atributul "font-size" dupa cum urmeaza:

Cod:
h1 { font-size: 30px; }
h2 { font-size: 20px; }
p { font-size: 12px; }


Exemplele de mai sus functioneaza foarte bine in Firefox Opera si Google Cherome, dar nu si in Internet Explorer problema apare atunci cand se mareste textul. Daca nu te intereseaza ca utilizatori paginii tale nu vor putea schimba marimea textului pentru o mai buna vizivilitate poti folosii expresiile de mai sus fara alte complicatii.

Dar daca vrei sa elimini si aceasta problema poti folosi "em" ca unitate de masura. Unitatea de masura "em" este recomandata de w3.org si 1em=16px.
Dupa cum se poate deduce, formula pt a calcula marimea textului in "em" este em=numar_pixeli/16.

Cod:
h1 { font-size: 1.875em; }
h2 { font-size: 1.25em; }
p { font-size: 0.75em; }


font variant

Font "variant" nu face in principìu mare lucru dar nu strica amintit:

Cod:
p { font-variant: small-caps; }


Expresia de mai sus transforma textul formatat cu ajutorul CSS in majuscule ceva mai mici decat cele norma
le.[/b]

Vezi subiectul anterior Vezi subiectul urmator Sus   Mesaj • Pagina 1 din 1