Александр Чиртик - HTML - Популярный самоучитель

В любой добавляемой в HTML‑документ таблице можно выделить три логически цельных части: шапка, тело таблицы и «футер» (нижняя часть таблицы, footer). Эти части состоят из строк, то есть строки таблицы можно сгруппировать в шапку, тело и футер.

Рассматриваемые части таблицы задаются следующим образом: шапка обозначается HTML‑элементом THEAD (

), тело задается элементом TBODY (), а футер – элементом TFOOT (). Все закрывающие теги являются необязательными. Внутри этих HTML‑элементов (между задающими их тегами) помещаются строки, относящиеся к соответствующим частям таблицы (пример 7.6). Первая строка шапки...Вторая строка шапки...Строка данных...

...

Строка футера...

Данные таблицы задаются с использованием элементов TH и TD. В приведенном примере закрывающие теги элементов THEAD, TBODY и TFOOT можно опустить. Задавая различные значения атрибутам align, valign, bgcolor в открывающих тегах рассматриваемых HTML‑элементов, можно управлять отображением сразу всех ячеек той или иной части таблицы.

Любая таблица может содержать несколько частей, обозначенных элементом TBODY. Нужно также отметить, что принадлежность строк к телу таблицы подразумевается по умолчанию, то есть если в таблице есть строки, перед определением которых в тексте HTML‑документа не было ни

. Этот элемент позволяет установить общие параметры отображения всех ячеек, входящих в столбец или столбцы, заданием следующих атрибутов:

• align – задает горизонтальное выравнивание текста ячеек столбца (столбцов), может принимать значения left, right, center или justify;

• valign – задает вертикальное выравнивание текста ячеек столбца (столбцов), может принимать значения top, bottom, middle или baseline;

• bgcolor – задает цвет фона ячеек столбца (столбцов);

• width – позволяет указать ширину столбца (столбцов);

• span – задает количество столбцов, к которым применяются параметры, заданные в описанных выше атрибутах (по умолчанию имеет значение 1).

Использование элемента COL не позволяет создавать группы столбцов – для этого используется HTML‑элемент COLGROUP. Однако использование элемента COL значительно облегчает настройку внешнего вида таблицы, позволяя задавать одинаковые настройки для нескольких столбцов одновременно. Например, чтобы создать таблицу, показанную на рис. 7.7, пришлось бы задавать значения атрибутов bgcolor почти для всех ячеек таблицы.

Рис. 7.7. Раскрашенная таблица

При использовании элемента COL все гораздо проще (пример 7.8).

Доходы от продаж за второе полугодие XXXX

года

Филиал\Период

3 квартал 4 квартал Июль Август Сентябрь Октябрь Ноябрь Декабрь Филиал 1 123123 323233 323453 231423 323212 243673 Филиал 2 223523 225243 314423 212445 373812 274673 Филиал 3 183123 186834 323453 231423 323212 243673 Филиал 4 125163 334343 123553 167423 254412 132367

...

Кроме того, пусть таблица имеет ширину 100 пикселов. Сначала вычисляются процентные размеры, а потом пропорциональные, поэтому третий столбец таблицы будет иметь ширину 30. Оставшиеся 70 пикселов распределяются между первым и вторым столбцами в соотношении 2:3, то есть ширина этих столбцов получится равной 70 : 5 × 2 = 28 и 70 : 5 × 3 = 42 соответственно.

Теперь, после достаточно долгого изучения HTML‑элемента COL, рассмотрим, как можно создавать группы столбцов таблицы с использованием элемента COLGROUP. Элемент COLGROUP задается парными тегами

и (закрывающий тег необязателен). Он поддерживает тот же набор атрибутов, что и элемент COL.

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

Например, если нужно создать группу из десяти столбцов, имеющих одинаковую ширину 30, а также одинаковые остальные параметры, то это можно сделать так:

или

или

...

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

Читать дальше