Размер шрифта

Свойство font-size задаёт размер текста. Пиксели вы уже знаете:

h1 {
	font-size: 40px;
}

Но для текста мы обычно берём другую единицу: rem. 1rem — это базовый размер шрифта в браузере, обычно 16 пикселей. Значит, 2rem — это 32 пикселя, а 0.5rem — 8 пикселей (десятичные дроби пишутся через точку, как всегда в CSS).

Почему не просто пиксели? Люди с плохим зрением часто задают в настройках браузера увеличенный базовый размер шрифта. Размеры в rem растут вместе с ним, поэтому вся страница остаётся читаемой и сохраняет пропорции. Размеры в пикселях не меняются, что бы ни выбрал посетитель.

Обычный текст по умолчанию имеет размер 16 пикселей (1rem), а заголовки браузеры делают крупнее: заголовок h1 — 32 пикселя, а заголовок h2 — 24 пикселя.