Folosind un em valoarea creează o dinamică sau calculat dimensiunea fontului (din punct de vedere istoric em unitatea a fost derivat din lățimea de un capital de „M” într-un anumit font.). Valoarea numerică acționează ca un multiplicator al proprietății font-size a elementului pe care este utilizat., Luați în considerare acest exemplu:
p { font-size: 2em;}În acest caz, dimensiunea fontului <p> elemente vor fi de două ori calculat font-size moștenit de <p> elemente. Prin extensie, un font-size de 1em este egal cu cel calculat font-size al elementului pe care este folosit.,
Dacă un font-size nu a fost stabilit pe oricare dintre <p>‘e strămoși, atunci 1em va fi egal cu browser-ul implicit font-size, care este de obicei 16px. Deci, în mod implicit 1em este echivalent cu 16px și 2em este echivalent cu 32px., Dacă ați fost de a stabili un font-size de 20px pe <body> element spun, atunci 1em pe <p> elemente ar fi echivalent cu 20px, și 2em ar fi echivalent cu 40px.,
În scopul de a calcula em echivalente pentru orice valoare a pixelilor este necesar, puteți folosi această formulă:
em = desired element pixel value / parent element font-size in pixels
em este un foarte util unitate în CSS, deoarece se adapteaza automat lungimea relativă pentru fontul pe care cititorul decide să o folosească.un fapt important de reținut: compusul valorilor em., Ia următoarele HTML și CSS:
html { font-size: 62.5%; /* font-size 1em = 10px on default browser settings */}span { font-size: 1.6em;}<div><span>Outer <span>inner</span> outer</span></div>rezultatul este:
Presupunând că browser-ul implicit font-size este 16px, cuvintele „exterior” vor fi prestate la 16 pixeli, dar cuvântul „interior” ar fi prestate la 25,6 px. Acest lucru este pentru interior <span>‘s font-size este 1.6 em care este în raport cu părintele său e font-size, care este la rândul său relativ la părinte font-size. Acest lucru este adesea numit compoundare.