- •Введение в таблицы css
- •17.2 Модель таблиц css
- •17.2.1 Анонимные объекты таблицы
- •17.3 Селекторы столбцов
- •17.4 Таблицы в модели визуального форматирования
- •17.4.1 Положение и выравнивание заголовка
- •17.5 Визуальное расположение содержимого таблицы
- •17.5.1 Слои и прозрачность таблицы
- •17.5.2 Алгоритмы определения ширины таблицы: свойство 'table-layout'
- •Фиксированное расположение таблицы
- •Автоматическое расположение таблицы
- •17.5.3 Алгоритмы определения высоты таблицы
- •17.5.4 Горизонтальное выравнивание в столбце
- •17.5.5 Динамические эффекты строк и столбцов
- •17.6 Границы
- •17.6.1 Модель отдельных границ
- •Границы вокруг пустых ячеек: свойство 'empty-cells'
- •17.6.2 Модель с пересекающимися границами
- •Разрешение конфликтов между границами
- •17.6.3 Стили границ
- •17.7 Автоматическое представление таблиц
- •17.7.1 Произносимые заголовки: свойство 'speak-header'
17.5 Визуальное расположение содержимого таблицы
Как и другие элементы языка документа, внутренние элементы таблицы генерируют прямоугольные блоки с содержимым, полями внутри ячейки и границами. Однако они не имеют полей.
Расположение этих блоков при визуальном представлении регулируется прямоугольной неравномерной сеткой строк и столбцов. Каждый блок занимает определенное количество ячеек, определяемое согласно следующим правилам. Эти правила не применяются в HTML 4.0 и в более ранних версиях; язык HTML устанавливает собственные ограничения на строки и столбцы.
Каждый блок строки занимает одну строку ячеек сетки. Все вместе блоки строк заполняют таблицу сверху вниз в порядке, в котором они располагаются в исходном документе (т.е. таблица занимает ровно столько строк, сколько в таблице элементов строк).
Группа строк занимает те же ячейки, что и строки, которые она включает.
Блок столбцов занимает одну или несколько ячеек сетки. Блоки столбцов помещаются рядом друг с другом в указанном порядке. Первый блок столбцов может находиться слева или справа, в зависимости от значения свойства 'direction' таблицы.
Блок группы занимает те же ячейки сетки, что и содержащиеся в группе столбцы.
Ячейки могут занимать несколько строк или столбцов. (Хотя в спецификации CSS2 не дается способ определения количества занимаемых ячейкой строк или столбцов, у агента пользователя могут быть особые сведения об исходном документе; возможно, в будущих версиях CSS будет определен способ представления такой информации посредством синтаксиса CSS.) Таким образом, каждая ячейка является прямоугольным блоком, по ширине и высоте равным одной или нескольким ячейкам сетки. Верхняя строка этого прямоугольника находится в строке, определяемой родительским элементом ячейки. Этот прямоугольник должен находиться как можно левее, но он не может перекрывать другой блок ячейки и должен находиться правее всех ячеек одной строки, расположенных до него в исходном документе. (Это ограничение сохраняется и в том случае, если свойство 'direction' таблицы имеет значение 'ltr'; если свойство 'direction' имеет значение 'rtl', в предыдущем предложении следует заменить по смыслу слова "слева" на "справа".)
Блок ячейки не может выходить за пределы последней строки таблицы или группы строк; поэтому агенты пользователей должны соответственно сокращать его.
Примечание. Ячейки таблицы могут позиционироваться относительно и абсолютно, но такое позиционирование использовать не рекомендуется: при размещении и прикреплении блок может быть удален, что влияет на выравнивание таблицы.
Далее представлено два примера. Первый относится к документам HTML:
<TABLE>
<TR><TD>1 <TD rowspan="2">2 <TD>3 <TD>4
<TR><TD colspan="2">5
</TABLE>
<TABLE>
<ROW><CELL>1 <CELL rowspan="2">2 <CELL>3 <CELL>4
<ROW><CELL colspan="2">5
</TABLE>
Форматирование второй таблицы показано на рисунке справа. Однако представление таблицы HTML не определено явным образом средствами HTML, и CSS также не определяет его. Агенты пользователей могут представлять таблицы на свое усмотрение, например, так, как показано на рисунке слева.
[D]
Слева - один из вариантов представления некорректной таблицы HTML 4.0; справа - единственный возможный вариант форматирования аналогичной таблицы, описанной без использования HTML.