CSS. Каскадные таблицы стилей. Подробное руководство.Символ-Плюс 2008

Печать

Большая часть текста не входит в состав строкового элемента. Поэтому, если представить, что каждая строка содержится в вымышленном элементе line, модель работает довольно хорошо.

Строковые незамещаемые элементы

Опираясь на уже полученную информацию о форматировании, перейдем к построению строк, содержащих только незамещаемые элементы (или анонимный текст). Это поможет вам понять разницу между неза-мещаемыми и замещаемыми элементами в компоновке строки.

Построение блоков

Во-первых, для строковых незамещаемых элементов или фрагмента анонимного текста значение свойства font-size определяет высоту области содержимого. Если font-size строкового элемента - 15рх, то высота области содержимого составляет 15 пикселов, потому что все кегельные квадраты элемента имеют высоту 15 пикселов, как показано нарнс. 7.30.

Рис. 7.30. Кегельные квадраты определяют высоту области содержимого

Затем следует рассмотреть значение свойства line-height элемента и разницу между ним и значением font-size. Если font-size строкового не-замещаемого элемента составляет 15рх, а его line-height - 21 px, разница - 6 пикселов. Агент пользователя делит шесть пикселов пополам и половину добавляет сверху, а половину - снизу области содержимого; так формируется строковый блок. Этот процесс проиллюстрирован на рис. 7.31.

Предположим, имеется следующая разметка:

Рис. 7.31. Область содержимого плюс межстрочный интервал равняется строковому блоку