Чему равен font-size?
Что оно на самом деле меняет?
А на самом деле font-size
определяет высоту рабочего квадрата, в который вписана каждая буква. Увидеть его можно только в каком-нибудь редакторе шрифтов: FontForge, например. Там он измеряется в условных единицах, а в вёрстке принимает значение, равное заданному font-size
. Для каждого шрифта этот квадрат имеет свои параметры, и именно поэтому разные гарнитуры при равном размере выглядят кто крупнее, кто мельче. Там же, в метриках шрифта, заданы размеры заглавных и строчных букв, то есть для нас они станут прямой пропорцией от 16px.
Следующий вопрос: чему при этом равно line-height
, которое по умолчанию, вообще-то, normal
? Высота строки для каждого шрифта тоже индивидуальна и равна сумме выносных элементов плюс межстрочный зазор (и ещё плюс округление браузера, ведь он не станет работать с половинками пикселей). Величины всех этих метрик заданы в параметрах шрифта и повлиять на них из вёрстки мы никак не можем! И ещё одно: высота строки измеряется не от базовых линий (нижней границы букв). Если подумать, это весьма логичный вывод из всего вышесказанного.
И самое последнее, что важно понимать: мерить в макете какие-либо размеры от границ букв — плохая идея.