Лабораторная работа №6. Создание таблиц в web-страницах

Цель работы: Познакомиться с возможностями HTML по созданию таблиц в web -страницах.

Основные понятия.

В HTML таблицы используются не только традиционно, как метод представления данных, но и как средство форматирования web -страниц.

Описание таблиц должно располагаться внутри раздела документа BODY. Документ может содержать произвольное число таблиц, причём допускается вложенность таблиц друг в друга. Каждая таблица должна начинаться тэгом <table> и завершаться тэгом </table>. Внутри этой пары тэгов располагается описание содержимого таблицы. Любая таблица состоит из одной или нескольких строк, в каждой из которых задаются данные для отдельных ячеек.

Каждая строка начинается тэгом <TR> и завершается тэгом </TR>. Отдельная ячейка в строке обрамляется парой тэгов <TD> и </TD> или <TH> и </TH>. Тэг <TH> используется обычно для ячеек-заголовков таблицы, а <TD> – для ячеек-данных. Тэги <TD> и <TH> не могут появляться вне описания строки таблицы <TR>. Завершающие коды </TR>, </TD> и </TH> могут быть опущены.

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

Таблица может иметь заголовок, который заключается в пару тэгов <CAPTION> и </CAPTION>. Описание заголовка таблицы должно располагаться сразу же после тэга <table> и до первого <TR>. Тэг заголовка таблицы имеет необязательный параметр ALIGN, принимающий значения ТОР (заголовок над таблицей) или BOTTOM (заголовок под таблицей).

В тэге <table> могут использоваться параметры:

· BORDER – определяет толщину рамки;

· CELLSPACING – определяет расстояние между ячейками;

· CELLPADDING – определяет расстояние между содержимым ячейки и её границами;

· WIDTH – определяет ширину таблицы;

· ALIGN – определяет горизонтальное расположение таблицы в области просмотра. Допустимые значения LEFT и RIGHT.

Браузер MS Internet Explorer разрешает кроме перечисленных пяти параметров использовать параметры:

HEIGHT – определяет высоту таблицы;

BGCOLOR – определяет фоновый цвет таблицы;

BORDERCOLOR – определяет цвет всех элементов рамок таблицы;

BORDERCOLORLIGHT – окрашивает в заданный цвет левый и верхний края всей таблицы и соответственно правый и нижний края каждой ячейки;

bordercolordark – окрашивает в заданный цвет правый и нижний края всей таблицы и соответственно левый и верхний края каждой ячейки;

BACKGROUND – определяет фоновый рисунок для таблицы.

Эти параметры могут применяться как для таблицы в целом, так и для отдельных ячеек.

Для сложных таблиц характерна потребность в объединении нескольких смежных ячеек по горизонтали или по вертикали в одну. Данная возможность реализуется с помощью параметров colspan и rowspan, задаваемых в кодах <TD> или <TH>. Форма записи: coLSPAN=num, где num – числовое значение, определяющее, на сколько столбцов следует расширить текущую ячейку по горизонтали. Применение параметра ROWSPAN аналогично, только здесь указывается количество строк, которые должна захватить текущая ячейка по вертикали.

<TABLE WIDTH=50% BORDER=2 CELLSPACING=2 CELLPADDING=2>

<CAPTION>Название таблицы</CAPTION>

<TR> <TH BGCOLOR=green COLSPAN=2>ячейка-заголовок</TH> </TR>

<TR> <TD>ячейка 1</TD> <TD>ячейка 2</TD> </TR>

<TR> <TD>ячейка 3</TD> <TD>ячейка 4</TD> </TR>

</TABLE>

Для форматирования данных внутри ячеек таблицы предусмотрены параметры горизонтального выравнивания ALIGN и вертикального выравнивания valign.

Параметр ALIGN может принимать значения LEFT, RIGHT и CENTER.

Параметр valign может принимать значения ТОР (по верхнему краю), BOTTOM (по нижнему краю), MIDDLE (посередине), BASELINE (по базовой линии). По умолчанию – MIDDLE.