Пункты, пиксели и em
Выбор правильной единицы
Сравнить единицыРазличные типографские единицы служат разным целям. Пункты подходят для печати, пиксели — для экранов с фиксированным разрешением, а em/rem — для адаптивного дизайна. Правильный выбор обеспечивает корректное отображение шрифтов в любом контексте.
Сравнение единиц
| Единица | Тип | Лучше всего подходит для |
|---|---|---|
| pt (пункты) | Абсолютная | Печатный дизайн |
| px (пиксели) | Абсолютная* | Элементы экранного интерфейса |
| em | Относительная | Отступы компонентов |
| rem | Относительная | Глобальные шкалы шрифтов |
| % (проценты) | Относительная | Гибкие макеты |
| vw/vh | Относительная | Размеры на основе области просмотра |
*CSS-пиксели — это эталонные пиксели, а не физические пиксели экрана.
Заключение
Современный адаптивный дизайн отдаёт предпочтение rem для базовой типографики и em для размеров относительно компонентов. Пиксели подходят для точного контроля, когда масштабирование не требуется. Пункты по-прежнему незаменимы для печати. Понимание поведения каждой единицы помогает создавать единообразный и доступный дизайн.