Pixeli în em
Convertiți px în em folosind dimensiunea fontului unui element părinte.
Cum se transformă px în em
1. Identificați dimensiunea fontului elementului părinte în px (de exemplu, 18 px).
2. Introdu valoarea px de convertit (de exemplu, 9 px spațiere între litere).
3. Citiți rezultatul (9 ÷ 18 = 0,5 em).
4. Aplicați în CSS pe elementul fiu încadrat în acel context părinte.
Px to em exemple
Captuseala nasturii
Font părinte 16 px; umplutură verticală 8 px → 0,5 em. Scalează dacă părintele devine 18 px pe ecrane mari.
Titlu imbricat
Font secțiune 20 px; subtitlu 24 px design → 1,2 em relativ la secțiune, nu rădăcină.
Alinierea pictogramei
Pictogramă în linie 14 px cu linie de text de 16 px → caseta de pictogramă 0,875 em se aliniază la valorile text.
Când să convertiți px în em
• Când elementele interne ale componentelor ar trebui să se scaleze cu modificările locale ale dimensiunii fontului.
• Când stilați text îmbogățit în care titlurile se află în containere de dimensiuni diferite.
• Când CSS vechi le folosea și mapați noi modele px în același sistem.
Evitarea capcanelor de agravare
Meniurile imbricate profund cu dimensiunea fontului: 0,9 em la fiecare nivel micșorează textul în mod neașteptat. Prefer rem pentru dimensiunea fontului la niveluri structurale; folosești em pentru umplutura locală legată de un părinte. Documentează ipotezele părintelui în jetoane de proiectare.
Întrebări frecvente
Care este diferența dintre em și rem?
em face referire la dimensiunea fontului părinte; rem face referire numai la dimensiunea fontului rădăcină (html).
De ce se compune im imbricat?
Fiecare nivel se înmulțește: 1,2 em în interiorul 1,2 em părinte = 1,44 × rădăcină dacă ambele se aplică lanțurilor de dimensiuni de font.
Formula?
em = px ÷ parentFontSizePx. Folosește întotdeauna dimensiunea fontului calculată de părintele direct.
Umplutură în ele?
Da — padding/margin la scara em cu dimensiunea fontului propriu a elementului (pentru margine/margine, spec folosește dimensiunea fontului elementului).
Când au apărut ele?
În mod tradițional „lățimea M majusculei” în tip metal; acum definit în raport cu dimensiunea fontului în CSS.