Em – относительная единица измерения размеров шрифта. Ее название пришло из области типографии, где оно соответствует размеру заглавной буквы М, которая, как правило, является самым широким символом шрифта. В CSS 1em соответствует размеру шрифта, используемому в системе пользователя по умолчанию, или размеру шрифта родительского элемента, если он отличается от используемого по умолчанию.

Если вы используете em (или другие относительные единицы) для задания размера всех шрифтов, пользователи смогут изменять размер символов текста в соответствии с настройками размера символов, установленными в их браузере. Для примера создадим описание стиля, задающее размер шрифта внутри элемента p равным 1em:

p {
font-size: 1em;
}

При просмотре страницы в браузере Internet Explorer 8, в котором размер шрифта установлен на Средний, данный абзац будет выглядеть, как на рис. 2.1.

Рис. 2.1. Отображение абзаца при установке свойства font-size равным 1em и размер шрифта  – Средний

Если в браузере настройка размера шрифта – Самый крупный, то абзац с размером шрифта в 1em будет выглядеть, как на рис. 2.2.

 Рис. 2.2. Отображение абзаца при установке свойства font-size равным 1em и размер шрифта – Самый крупный

Использование em для задания размера шрифта ограничивает ваши возможности по управлению отображением документа. Однако этот подход означает, что посетитель, которому необходим крупный шрифт, сможет прочитать ваш контент, ведь в конечном счете именно для этого вы и размещаете текст на страницу.

Значения в em можно задавать десятичными числами. К примеру, чтобы задать размер шрифта на 10 процентов меньше используемого по умолчанию (или размера шрифта родительского элемента), можно использовать следующее правило:

p {
font-size: 0.9em;
}

Чтобы текст стал на 10 процентов крупнее, чем при использовании значения по умолчанию или унаследованного значения, можно использовать следующее правило:

p {
font-size: 1.1em;
}