Высота является стандартной мерой
Высота шрифта измеряется или определяется высотой строки, которая является полной высотой, необходимой для отображения гаммы символов, в том числе тех, которые опускаются ниже линии, например j, и выпуклых элементов (ударения на заглавных буквах, например) как Ê.
Различные шрифты в 24px и 12px http://media.banzaimonkey.net/images/forums/font-sizes.png
Шрифты в порядке появления: Times New Roman, Courier New, Calibri, Consolas.
Ширина
Ширина символов зависит от шрифта, как вы можете видеть на изображении выше. Существует также важное различие между пропорциональными и fixed-width шрифтами. Для шрифтов фиксированной ширины пространство, занимаемое каждым символом в строке, точно такое же (хотя сами символы могут не совпадать по размеру с другими. Для пропорциональных шрифтов пространство, используемое каждым символом, больше соответствует его форма относительно других символов, поэтому i , j и l различаются узко, в то время как w , m и o обычно шире.
Шрифты
Сами шрифты воспроизводят глифы по-разному (очевидно, поскольку шрифты выглядят по-разному), и это означает, что конкретный символ не обязательно будет отображать одинаковую высоту между шрифтами. Это также означает, что не существует стандартного способа выяснить, какой высоты может быть определенный символ при любом заданном размере, кроме визуализации шрифта.
Это, вероятно, не очевидно для большинства, но если вы изучите условия лицензирования для шрифтов, вы заметите, что они лицензируются как программное обеспечение для шрифтов . По сути, каждый шрифт содержит набор алгоритмов, которые определяют, как шрифт должен отображаться в данном контексте (различные размеры, полужирный, курсив и т. Д.).
Следовательно, лучший способ выяснить, как шрифт будет отображаться в данном контексте, - это отобразить его и посмотреть.
Проблемы с размерами
Есть некоторые предостережения относительно размеров шрифта, когда вы имеете дело с вещами в Интернете.
Для Интернета
Как знает любой хороший веб-дизайнер, нет равных. Существует бесчисленное множество переменных, которые вступают в игру при визуализации страницы, что может привести к различиям между пользователями, такими как браузер, шрифты по умолчанию, масштабирование, сглаживание, подсказки, масштабирование браузера, масштабирование операционной системы и т. Д.
В «List Apart» (до того как они прыгнули с акулы) есть несколько хороших статей о стандартизации размеров шрифта и о том, как помочь вам получить некоторый уровень сходства между браузерами:
Несмотря на то, что вы можете проявить должную осмотрительность, вы просто должны признать, что веб-среда имеет определенный уровень изменчивости, который вы не можете контролировать.
Печать против пикселей
Поскольку пиксели обычно не являются естественным масштабом для шрифтов (для печати используются разные измерения), алгоритмы хинтинга могут отрисовывать шрифты на один или два пикселя, особенно при небольших размерах, чтобы сохранить форму символов.
На самом деле, алгоритм хинтинга часто совершенно различен при небольших размерах, и в профессиональной работе вы, вероятно, использовали бы совершенно другой шрифт для размеров ниже 12 пт.
Пиксели также относятся к размеру дисплея, поэтому 12px будет другого физического размера на этих дисплеях:
- 20 "монитор с разрешением 1680x1050
- 22 "монитор с разрешением 1680x1050
- Экран iPhone
- Экран Blackberry
- и т.д.
TL; DR
Итак, в общем, это сложно. font-size относится к высоте, необходимой для отображения гаммы символов, но в диком и неясном интернете всегда есть исключения.