Единицы измерения при работе с HTML и CSS

Существует множество единиц измерения, которые вы можете использовать при верстке своего сайта. Но необходимо ли использовать их все? Чем отличаются единицы rem и em? И что лучше относительные единицы измерения или же абсолютные, такие как px, cm и mm. Постараемся разобраться с этими вопросом в нашем учебнике.

Пиксели — px

Пиксель — это также наименьшая единица растрового изображения, получаемого с помощью графических систем вывода информации (компьютерные мониторы, принтеры и т. д.). Разрешение такого устройства определяется горизонтальным и вертикальным размерами выводимого изображения в пикселях (например, режим VGA — 640 × 480 пикселей).

em и rem

Относительные единицы измерения, которые зависят от базовых заданных значений.

Проценты — %

От 0% до 100% от размеров родительского блока.

vw, vh, vmin и vmax

Согласно черновику стандарта CSS Values and Units 3, данные единицы имеют следующие размеры:

• vw – 1% ширины окна
• vh – 1% высоты окна
• vmin – наименьшее из (vw, vh), в IE9 обозначается vm
• vmax – наибольшее из (vw, vh)