Размеры
Размеры имеют отношение к горизонтальным и вертикальным измерениям.
Формат значения размера (обозначаемого в этой спецификации <length>) - это необязательный символ знака ('+' или '-', с '+' по умолчанию), после которого сразу идёт <number> (с или без десятичной точки), после которого сразу идёт идентификатор единиц измерения (например, px, deg и т.п.). После размера '0' единицы измерения не обязательны.
Некоторые cвойства допускают негативные значения размеров, но это может усложнять модель форматирования и могут иметься ограничения, обусловленные конкретной реализацией. Если негативное значение размера не поддерживается, оно должно быть конвертировано до ближайшего поддерживаемого значения.
Есть два типа единиц измерения: относительные и абсолютные. Относительные размеры специфицируют значение размера относительно какого-либо исходного cвойства размера. Таблицы стилей, использующие относительные единицы измерения, легче масштабируются при переносе на различные носители (например, с дисплея компьютера на лазерный принтер).
Относительные единицы измерения являются:
- em: 'font-size' соответствующего шрифта;
- ex: 'x-height' соответствующего шрифта;
- px: пикселы, относительно устройства просмотра.
H1 { margin: 0.5em } /* em */ H1 { margin: 1ex } /* ex */ P { font-size: 12px } /* px */
Единицы измерения 'em' эквивалентны вычисленному значению cвойства 'font-size' того элемента, в котором оно используется. Исключением является тот случай, когда 'em' появляется в самом значении cвойства 'font-size', тогда оно относится к размеру шрифта родительского элемента. Может использоваться для вертикального или горизонтального измерения. (Эта единица измерения иногда называется quad-width/квад-ширина в типографском тексте.)
Единицы 'ex' определяются 'x-height' шрифта. x-height называется так, потому что она часто равна высоте "x" нижнего регистра. Однако 'ex' определены даже для тех шрифтов, которые не содержат "x".
Правило: H1 { line-height: 1.2em } означает, что высота строки элементов H1 будет на 20% больше, чем размер шрифта элементов H1. С другой стороны: H1 { font-size: 1.2em } означает, что размер шрифта элементов H1 будет на 20% больше, чем размер шрифта, наследуемый из элементов H1.
Если они специфицированы для корня дерева документа (например, "HTML" в HTML), 'em' и 'ex' относятся к начальному значению свойства.
Пикселы относительны к разрешению устройства просмотра, т.е. чаще всего - дисплея компьютера. Если плотность пикселов выводного устройства сильно отличается от плотности типичного компьютерного дисплея, ПА должен перемасштабировать пикселные значения. Рекомендуется, чтобы пиксел в качестве точки отсчёта был визуальным углом одного пиксела на устройстве с плотностью пикселов 90dpi на расстоянии вытянутой руки от читателя. При нормальной длине руки 28 дюймов визуальный угол будет примерно 0.0227 градусов.
При чтении с расстояния вытянутой руки 1px соответствует примерно 0.28 мм (1/90 дюйма). При печати на лазерном принтере, рассчитанном на чтение с несколько меньшего расстояния, чем вытянутая рука, (55 см, 21 дюймов), 1px составляет около 0.21 мм. На принтере с разрешением 300 точек на дюйм (dpi) это можно округлить до 3 точек (0.25 мм); на принтере с 600 dpi это можно округлить до 5 точек.
Два нижеследующих изображения иллюстрируют эффект при просмотре размера пиксела с расстояния и эффект разрешения устройства. На первом рисунке расстояние чтения 71 см (28 дюймов) даёт пиксел 0.28 мм, а с расстояния 3.5 м (12 футов) требуется пиксел 1.4 мм.
[D]
На втором рисунке область 1px на 1px закрывается одной точкой устройства с низким разрешением (экран компьютера), и та же самая область покрывается 16-ю точками на устройстве с высоким разрешением (как лазерный принтер 400 dpi).
[D]
Дочерние элементы не наследуют относительные значения, специфицированные для их родителя; они (обычно) наследуют вычисленные значения.
В следующих правилах вычисленное значение 'text-indent' элементов H1 будет 36pt, а не 45pt, если H1 является дочерним относительно элемента BODY: BODY { font-size: 12pt; text-indent: 3em; /* т.е. 36pt */ } H1 { font-size: 15pt }
Абсолютные единицы измерения используются только тогда, когда известны физические свойства выводного устройства.
Абсолютными значениями являются:
- in: inches/дюймы -- 1 дюйм равен 2.54 сантиметра.
- cm: сантиметры
- mm: миллиметры
- pt: points/пункты - пункт, используемый в CSS2, равен 1/72 дюйма.
- pc: picas/пики -- 1 пика равна 12 пунктам.
H1 { margin: 0.5in } /* дюймы */ H2 { line-height: 3cm } /* сантиметры */ H3 { word-spacing: 4mm } /* миллиметры */ H4 { font-size: 12pt } /* пункты */ H4 { font-size: 1pc } /* пики */
В тех случаях, когда специфицированные размеры не могут поддерживаться, ПА обязаны давать значение, приближённое к реальному.
