Единицы измерения CSS
Значения длины и размера для многих свойств задаются единицами измерения CSS.
Среди свойств, принимающих значения «длины», — font-size, width, margin, padding, border и другие.
Единицы делятся на два типа:
Абсолютные единицы CSS
Длина, заданная в абсолютной единице, фиксирована и отображается именно такого размера.
Изменение размера экрана не влияет на эти единицы, поэтому их не рекомендуется использовать для сайтов. Тем не менее они могут быть полезны, когда носитель вывода известен, например в макете для печати.
px (пиксели) — наиболее часто используемая абсолютная единица.
Относительные единицы CSS
Относительная единица измеряет длину относительно другого свойства длины, такого как родительский элемент, корневой элемент или область просмотра (viewport).
Поскольку относительные единицы длины лучше масштабируются на экранах разного размера, они идеальны для адаптивного веб-дизайна.
em и rem — две наиболее часто используемые относительные единицы.
Совет: Именно в масштабируемых и адаптивных сайтах em и rem проявляют себя лучше всего!