Превръщане на px в rem: px, rem, pt, em, mm
Последна актуализация:
rem се мери спрямо този размер. Тук спрямо него се мерят и em, и %, но в CSS те следват родителския елемент, затова съвпадат с rem само там, където никой родителски елемент не променя размера на шрифта.
1 px = 0,0625 remВсички резултати
Таблица за бърза справка: Пиксел → Root em
| Стойност (px) | Резултат (rem) |
|---|---|
| 1 px | 0,0625 rem |
| 8 px | 0,5 rem |
| 10 px | 0,625 rem |
| 12 px | 0,75 rem |
| 14 px | 0,875 rem |
| 16 px | 1 rem |
| 18 px | 1,125 rem |
| 20 px | 1,25 rem |
| 24 px | 1,5 rem |
| 32 px | 2 rem |
| 48 px | 3 rem |
| 64 px | 4 rem |
За px, rem и pt
CSS определя 1 инч като 96 px, така че 1 pt, тоест 1/72 инча, е равен на 1,333 px, а 1 mm е равен на 3,78 px. rem и em са относителни: 1 rem е размерът на шрифта на кореновия елемент, във всички основни браузъри 16 px, освен ако посетителят не го промени, така че 24 px са 1,5 rem. Ако таблицата със стилове задава друг коренов размер, въведете го като базов размер над полетата. em следва размера на шрифта на родителския елемент, затова е равен на rem само там, където никой родителски елемент не го променя.
Често срещани размери на текст и елементи
При базов размер по подразбиране 16 px. CSS определя 1 инч като 96 px, затова колоните pt и mm са верни при всеки базов размер; променя се само колоната rem.
| Размер | rem | pt | mm |
|---|---|---|---|
| Текст 10 pt (бележки под линия) | 0,8333 | 10 | 3,528 |
| Размер на текста по подразбиране в браузър | 1 | 12 | 4,233 |
| Текст 12 pt в текстов редактор | 1 | 12 | 4,233 |
| Заглавие h2 по подразбиране | 1,5 | 18 | 6,35 |
| Най-малка зона за кликване според WCAG 2.2 (2.5.8) | 1,5 | 18 | 6,35 |
| Заглавие h1 по подразбиране | 2 | 24 | 8,467 |
| 1 сантиметър | 2,362 | 28,35 | 10 |
| 1 инч | 6 | 72 | 25,4 |
История на пункта и пиксела
Шрифтът се е измервал в пунктове много преди появата на екраните: леярите на шрифтове са имали нужда от обща мярка, за да отливат букви, които застават в един ред. Компютрите утвърдиха пункта като 1/72 инча.
- Пиер-Симон Фурние публикува таблица с размери на шрифта, измерени в типографски пунктове: скалата ѝ дели инча на 12 линии, а всяка линия на 6 пункта.
- Асоциацията на леярите на шрифтове на Съединените щати приема пунктова система за размерите на шрифта, в която нонпарел е 6 пункта, а пика 12.
- Adobe представя PostScript, чиято единица за дължина върху страницата е 1/72 инча: по думите на Adobe приблизително същото като пункта, използван в печата.
- CSS 2.1 става препоръка на W3C. Спецификацията фиксира 1 инч на 96 px и 72 pt, така че 1 px е 0,75 pt, и обвързва пиксела с една точка от екран с 96 dpi, гледан от разстояние на изпъната ръка.
Източници: