CSS/Длины и единицы

Чтобы задать ширину, высоту и другие длины, вы можете использовать различные единицы измерения, перечисленные в следующей таблице.

Первые четыре величины являются относительными, а остальные — абсолютными.

Длина может быть также задана в процентах от другой длины. Использование процентов может быть сложным, так как основа длины варьируется от свойства к свойству. Например, когда проценты используются со свойством margin, расчёт основан на ширине содержащего блока. Когда проценты используются со свойством font-size, расчёт основан на font-size родительского элемента, но с line-height он основан на значении font-size текущего элемента.

Размеры шрифтов на экране лучше всего установливать в процентах или em. Это означает, что страница будет правильно взаимодействовать с пользовательскими настройками шрифтов. Использование пикселей px для размеров шрифта вызывает ряд проблем и их следует избегать.

Абсолютные единицы mm, cm, pt, pc и in плохо работают на экране и могут привести к проблемам во многих старых браузерах. Безопаснее всего использовать их только для печатных СМИ. Даже в печатных СМИ они могут плохо взаимодействовать с пользовательскими настройками.

Относительные единицы (em, ex, px и %) определяют размер элемента относительно значения другого размера.

Например, em — высота шрифта текущего элемента, а ex — высота символа х в нижнем регистре.