Опубликован: 06.06.2006 | Уровень: для всех | Доступ: платный
Лекция 9:

Модель визуального форматирования

Аннотация: Описывается модель визуального форматирования: то как пользовательские агенты обрабатывают дерево документа для визуального носителя.
Ключевые слова: 9, схема позиционирования, модель визуального форматирования, алгоритм, начальный содержащий блок, 'position', 'float', разделы, CSS2, 'display', элемент таблицы уровня блока, 'block', 'list-item', 'compact', 'run-in', 'table', основной бокс блока, контекст форматирования, анонимный, бокс блока, анонимные инлайн-боксы, инлайн-элемент, 'inline', 'inline-table', компактный бокс, маркёры, поле бокса, 'direction', строчный бокс, край поля, 'left', 'right', Бокс run-in , table-row-group, table-header-group, table-footer-group, table-row, table-column-group, table-column, table-cell, 'table-caption', псевдоэлемент, 'white-space', уровень блока, относительное позиционирование, 'top', 'bottom', край содержимого, внешний край, sentence, 'clear', позиционирование, управляющие, замещаемый элемент, пространство, IMG, icon, поле, HTML, форматирование, вертикальные поля, рамка бокса, игнорируется, край рамки, абсолютно позиционированный элемент, значение, Дополнение, контекст стэка, уровень в стэке, корневой элемент, корневой контекст стэка, локальный контекст стэка, 'z-index', локальный контекст стэка, двунаправленность (bidi), атрибут языка, глиф, вероятность, таблица, переопределение, inherit, N/A, justify, RLE, PDF, двунаправленный алгоритм UNICODE, предел, дисплей, XML, hebrew, длина, контекст, отображение

Введение

Эта и последующие главы описывают модель визуального форматирования: то как пользовательские агенты (ПА) обрабатывают "Соответствие: Требования и Рекомендации" для визуального "Типы носителя" .

В модели визуального форматирования каждый элемент дерева документа генерирует ноль или более боксов в соответствии с "Модель бокса" . Структура этих боксов управляется:

  • размерами боксов и типом.
  • схемой позиционирования (нормальное позиционирование, всплывание и абсолютное).
  • взаимоотношениями между элементами в дереве документа.
  • внешней информацией (например, размером порта просмотра, "Соответствие: Требования и Рекомендации" и т.д.).

Свойства, определённые в этой и следующих главах, применяются и к "Типы носителя" , и к страничным носителям. В то же время, значения свойств полей варьируются при использовании со страничным носителем (см. в "Страничные носители" ).

модель визуального форматирования не определяет все аспекты форматирования (например, она не специфицирует алгоритм расстояний между буквами). Поведение "Соответствие: Требования и Рекомендации" может отличаться в вопросах форматирования.

Порт просмотра

ПА для непрерывных носителей обычно предлагают пользователю порт просмотра (окно или другую область просмотра на экране), в котором пользователь видит документ. ПА могут изменять внешний вид документа, если порт просмотра изменил размеры (см. начальный содержащий блок ). Если порт просмотра меньше, чем начальный содержащий блок документа, ПА должен предоставить механизм прокрутки. Имеется не менее одного порта просмотра в канве, но ПА могут отображать более чем одну канву (т.е. предоставлять различные виды того же самого документа).

Содержащие блоки

В CSS2 многие варианты позиционирования и размеры вычисляются относительно кромки прямоугольного бокса, называемого содержащий блок. Обычно генерируемые боксы действуют как содержащие блоки для боксов-потомков; мы говорим, что бокс "устанавливает" содержащий блок для своих потомков. Фраза "блок, содержащий бокс" означает "блок, в котором бокс находится", а не блок, генерирующий бокс.

Каждый бокс имеет позицию относительно содержащего блока, но не ограничен этим блоком и может вызвать "Визуальные эффекты" .

Корневой элемент дерева документа генерирует бокс, который служит начальным содержащим блоком для последующего вывода.

Ширина начального содержащего блока может быть специфицирована свойством 'width' корневого элемента. Если это свойство имеет значение 'auto', ПА предоставляет начальное значение ширины (например, ПА использует текущую ширину порта просмотра).

Высота начального содержащего блока может быть специфицирована свойством 'height' корневого элемента. Если это свойство имеет значение 'auto', высота содержащего блока увеличивается, чтобы приспособиться к содержимому документа.

Начальный содержащий блок не может быть позиционирован или всплывать (т.е. ПА "Синтаксис CSS2 и базовые типы данных" свойства 'position' и 'float корневого элемента).

Детали того, как высчитываются размеры содержащего блока, описаны в "Модель визуального форматирования. Детали" .

Наталья Алмаева
Наталья Алмаева
Россия
Светлана Казьмина
Светлана Казьмина
Россия, Волгодонск