px į rem ir em konverteris
Konvertuokite tarp px, rem ir em naudodami savo pagrindinį bei konteksto šrifto dydžius – redaguokite bet kurį lauką, o kiti du atsinaujins rašant.
| px | rem |
|---|---|
| 8 | 0.5 |
| 12 | 0.75 |
| 14 | 0.875 |
| 16 | 1 |
| 18 | 1.125 |
| 20 | 1.25 |
| 24 | 1.5 |
| 32 | 2 |
| 40 | 2.5 |
| 48 | 3 |
Kiekvienas konvertavimas atliekamas jūsų naršyklėje. Jokie įvesti duomenys nėra siunčiami į „BroBroGo“.
DUK
Kuo skiriasi px, rem ir em?
px yra fiksuotas ilgis. rem matuojamas pagal puslapio pagrindinį (root) šrifto dydį, todėl esant 16px pagrindui, 1rem lygus 16px. em matuojamas pagal elemento, kuriame jis yra, šrifto dydį. Naudojant rem šriftams ir tarpams, viskas proporcingai keičiasi, kai skaitytojas pakeičia savo numatytąjį naršyklės šrifto dydį.
Kodėl yra atskiras em konteksto dydis?
em vienetas yra santykinis pagal savo paties elemento šrifto dydį, kuris ne visada sutampa su pagrindiniu (root). Nustatykite em kontekstą pagal to elemento šrifto dydį, kad teisingai apskaičiuotumėte em reikšmę, arba palikite jį lygų pagrindiniam dydžiui, jei jie sutampa.
Ką daryti, jei mano pagrindinis šrifto dydis nėra 16px?
Pakeiskite pagrindinio šrifto dydžio laukelį, kad jis atitiktų jūsų CSS, ir kiekviena rem reikšmė akimirksniu atsinaujins. Žemiau pateikta lentelė yra patogus orientyras dažniausiai naudojamam 16px pagrindui.