Fonturi CSS. Setarea dimensiunii fontului cu Em. Folosirea unei combinații de procente și Em.
Partajeaza in Google Classroom
Partajeaza cu Google Classroom
Susține Lectii-Virtuale!
Memorator: Descriere video Descarcă PDF
Setați dimensiunea fontului cu Em
Pentru a permite utilizatorilor să redimensioneze textul (în meniul browserului), mulți dezvoltatori folosesc em în loc de pixeli.
Unitatea de dimensiuni em este recomandată de W3C.
1em este egal cu dimensiunea curentă a fontului. Dimensiunea implicită a textului în browsere este 16px. Deci, dimensiunea implicită de 1em este 16px.
Mărimea poate fi calculată de la pixeli la em folosind această formulă: pixeli / 16 = em.
Exemplu:
Din păcate, există încă o problemă cu versiunile mai vechi de IE. Textul devine mai mare decât ar trebui atunci când este făcut mai mare și mai mic decât ar trebui când este făcut mai mic.
Folosiți o combinație de procente și Em
Soluția care funcționează în toate browserele este să setați o dimensiune de font implicită în procent pentru elementul <body>:
Exemplu:
Pentru a permite utilizatorilor să redimensioneze textul (în meniul browserului), mulți dezvoltatori folosesc em în loc de pixeli.
Unitatea de dimensiuni em este recomandată de W3C.
1em este egal cu dimensiunea curentă a fontului. Dimensiunea implicită a textului în browsere este 16px. Deci, dimensiunea implicită de 1em este 16px.
Mărimea poate fi calculată de la pixeli la em folosind această formulă: pixeli / 16 = em.
Exemplu:
h1 {
font-size: 2.5em; /* 40px/16=2.5em */
}
h2 {
font-size: 1.875em; /* 30px/16=1.875em */
}
p {
font-size: 0.875em; /* 14px/16=0.875em */
}
În exemplul de mai sus, dimensiunea textului în em este aceeași cu exemplul precedent în pixeli. Cu toate acestea, cu dimensiunea em, este posibil să ajustați dimensiunea textului în toate browserele.Din păcate, există încă o problemă cu versiunile mai vechi de IE. Textul devine mai mare decât ar trebui atunci când este făcut mai mare și mai mic decât ar trebui când este făcut mai mic.
Folosiți o combinație de procente și Em
Soluția care funcționează în toate browserele este să setați o dimensiune de font implicită în procent pentru elementul <body>:
Exemplu:
body {
font-size: 100%;
}
h1 {
font-size: 2.5em;
}
h2 {
font-size: 1.875em;
}
p {
font-size: 0.875em;
}
Codul de mai sus arată aceeași dimensiune a textului în toate browserele și permite tuturor browserelor să mărească sau să redimensioneze textul! Navigare în lectii
Cumpara abonament
Ajutor
Feedback-ul d-voastră este important pentru noi. Dacă observați vreo neregulă vă rugăm să ne-o semnalați apăsând butonul Trimite Feedback de mai jos.
