Таблицы удобны для представления больших объемов данных, а многие Web-дизайнеры используют их также для точного размещения элементов Web-страниц (рис. 19.6). Таблица в языке HTML задается при помощи парного тега <TABLE>. Она может содержать заголовок таблицы, определяемый парным тегом <CAPTION>, и строки таблицы, создаваемые при помощи парных тегов <TR>. Закрывающие теги </TR> можно опускать.
Каждая строка таблицы содержит ячейки таблицы, к которые могут относится к двум разным типам. Ячейки в заголовках столбовых строк задают парным тегом<TH>, а обычные ячейки – парным тегом<TD>. Закрывающие теги</TH> и </TD> можно опускать. Например, «пустая» таблица с двумя строками и двумя столбцами может быть задана следующим образом:
<TABLE>
<CAPTION> Пустая таблица </CAPTION>
<TR><TD><TD>
<TR><TD><TD>
</TABLE>
Каждая ячейка может содержать произвольный текст, а так же любые теги HTML, допустимые в «теле» документа. В частности, ячейка таблицы может содержать вложенную таблицу или изображение.
|
|
При отображении таблицы на экране компьютера происходит ее автоматическая форматирование с подбором размеров ячеек в соответствии с объемом размещаемой информации и заданными атрибутами. Атрибуты элементов позволяют сколь угодно причудливо оформит таблицу по своему вкусу. В таблице 19.1 приведена краткая сводка допустимых атрибутов.
Таблица 19.1. Атрибуты элементов, используемых при создании таблицы.
Атрибут | Элемент | Назначение |
ALIGN= | Таблица, заголовок, строка, ячейка | Выравнивание таблицы по горизонтали; выравнивание данных по горизонтали; размещение заголовка над или под таблицей |
VALIGN= | Строка, ячейка | Выравнивание по вертикали |
WIDTH= | Таблица, ячейка | Ширина |
HEIGHT= | Ячейка | Высота |
COLSPAN= | Ячейка | Протяженность в несколько столбцов |
ROWSPAN= | Ячейка | Протяженность в несколько строк |
BGCOLOR= | Таблица, ячейка | Цвет фона |
CELLSPACING= | Таблица | Зазор между ячейками |
CELLPADDING= | Таблица | Зазор между содержимым ячейки и ее границей |
BORDER= | Таблица | Отображение границ ячеек и внешней рамки таблицы |