Существует четыре способа того, как задать размер шрифта:
В пикселах, например,
body {
font-size: 14px;
}
Когда вы указываете размер шрифта таким образом, вы говорите браузеру, какой высоты должны быть символы шрифта. Символы рх должны следовать сразу же после числа, не ставьте между ними пробел.
В процентах, например,
font-size: 150%;
Размер шрифта, заданный в процентах, определяет высоту шрифта относительно других шрифтов.
body {
font-size: 14px;
h1 {
font-size: 150%;
}
c.369
Учитывая, что font-sizeнаследуемое свойство, при задании размера таким способом проценты будут вычисляться относительно размера шрифта родительского элемента.h1 наследует свойства body, поэтому размер его шрифта будет 150% от размера шрифта элемента <body>.
В относительных единицах em.С помощьюem вы задаете масштабный коэффициент.
font-size: 1.2em; (Это означает, что размер шрифта будет масштабирован с коэффициентом 1.2)
Допустим, вы таким образом задаете размер заголовков <h2>. Тогда размер заголовков <h2> будет составлять 1.2 размера шрифта родительского элемента, что в нашем случае означает в 1.2 раза больше, чем 14рх, и примерно равняется 17рх.
По ключевым словам. Вы можете определить размер шрифта как xx-small, x-small, small, medium, large, x-large, xx-large, и браузер преобразует эти слова в значения в пикселах.
Обычно размеры шрифтов, которые задаются различными ключевыми словами, соотносятся друг с другом таким образом. Каждый следующий размер примерно на 20% больше предыдущего, а small обычно равен 12 пикселов в высоту. Тем не менее не забывайте, что ключевые слова не всегда одинаково определяются в различных браузерах и пользователи при желании могут их переопределить.
body {
font-size: small;
}
В большинстве браузеров это правило задает размер шрифта в элементе body равным примерно 12 пикселов.
Придерживайтесь следующих рекомендаций при определении размера шрифта.
Выберите ключевое слово (рекомендуется small или medium) и укажите его в качестве размера шрифта в правиле для body. Таким образом вы зададите размер шрифта, используемый на вашей странице по умолчанию.
Задайте размеры шрифтов для остальных элементов относительно размера шрифта элемента body, используя либо проценты, либо em (выбор за вами, так как это по сути это два разных способа выполнения одного и того же действия).
Задав размеры шрифтов относительно размера шрифта элемента body, вы действительно легко сможете поменять их на всей веб-странице, просто изменив высоту шрифта для body. Если значение размера шрифта для body равняется small, просто поменяйте его на medium, и размеры шрифтов для всех остальных элементов автоматически пропорционально увеличатся, потому что они заданы относительно размера шрифта элемента body. Кроме того, в таком случае ваши пользователи и сами смогут изменить размер шрифтов на странице.
Внимание! Internet Explorer НЕ поддерживает масштабирование текста, если размер шрифта задан в пикселах.