Значит ли значение пикселя размера шрифта для высоты шрифта или ширины шрифта?
CSS
.sixteen {
font-size: 16px;
}
HTML:
<span class='sixteen'>a</span>
Будет ли "a" иметь высоту 16 пикселей или ширину 16 пикселей, или это как максимальная ширина/высота на обоих так, чтобы весь символ помещался в поле размером 16 пикселей?
Вся документация, которую я видел для этого, неоднозначна по этому вопросу.
Высота - особенно от вершины восходящих линий (например, "h" или "l" (el)) до нижней части ограничителей (например, "g" или "y" ). См. Интересную статью о анатомии типа в http://en.wikipedia.org/wiki/Typeface_anatomy.
Свойство font-size указывает размер шрифта, независимо от того, какой блок используется. Размер шрифта можно охарактеризовать как высоту шрифта, но даже это просто свободное и прагматичное описание; символы могут распространяться выше и ниже уровней, определяемых размером шрифта. Размер является более или менее абстрактным свойством, и не следует ожидать, что он будет соответствовать высоте (еще меньше ширины) любого символа.
В частности, было бы неправильно создавать шрифт, где буква "a" занимает всю высоту шрифта. Высота "a" обычно составляет примерно половину размера шрифта, но это, безусловно, зависит от шрифта (попробуйте проверить "a" в Times New Roman и в Verdana, используя тот же размер шрифта).
Согласно этой статье Винсента Де Оливейры, font-size на самом деле не имеет ничего общего с фактической высотой символов. Это даже не высота встроенного элемента, который содержит текст.
Конечно, большее значение свойства font-size приводит к большему тексту. Но значение пикселя напрямую не переводится в фактический размер текста.
Однако значение пикселя font-size устанавливает размер 1em, который будет использоваться для установки полей, отступов и т.д.