CSS/Длины и единицы
Чтобы задать ширину, высоту и другие длины, вы можете использовать различные единицы измерения, перечисленные в следующей таблице.
Код | Определение | Примечания |
---|---|---|
em | высота шрифта текущего элемента | |
ex | высота символа х в нижнем регистре | |
px | пиксель | |
% | процент | |
mm | миллиметр | |
cm | сантиметр | |
pt | пункт (1/72 дюйма) | |
pc | пика (12 пунктов = 1/6 дюйма) | |
in | дюйм (2,54 сантиметра) |
Первые четыре величины являются относительными, а остальные — абсолютными.
Длина может быть также задана в процентах от другой длины. Использование процентов может быть сложным, так как основа длины варьируется от свойства к свойству. Например, когда проценты используются со свойством margin, расчёт основан на ширине содержащего блока. Когда проценты используются со свойством font-size, расчёт основан на font-size родительского элемента, но с line-height он основан на значении font-size текущего элемента.
Размеры шрифтов на экране лучше всего установливать в процентах или em. Это означает, что страница будет правильно взаимодействовать с пользовательскими настройками шрифтов. Использование пикселей px для размеров шрифта вызывает ряд проблем и их следует избегать.
Абсолютные единицы mm, cm, pt, pc и in плохо работают на экране и могут привести к проблемам во многих старых браузерах. Безопаснее всего использовать их только для печатных СМИ. Даже в печатных СМИ они могут плохо взаимодействовать с пользовательскими настройками.
Относительные единицы (em, ex, px и %) определяют размер элемента относительно значения другого размера.
Например, em — высота шрифта текущего элемента, а ex — высота символа х в нижнем регистре.