Верстка таблиц

Таблицы являются мощнейшим средством HTML для верстки страниц.

До появления в языке HTML средств верстки таблиц, нельзя было

создать даже самый простой

многоколончатый текст или сводную таблицу, то после появления такой

возможности Web-дизайнеры стали использовать ее в полной мере и добиваться

сложных эффектов.

Создается таблица с помощью конструкции

<CAPTION>Заголовок</CAPTION>

...

</TD>

....

</TR>

</TABLE>

Тег TABLE начинает описание таблицы и может иметь следующие параметры:

BORDER - определяет толщину рамки таблицы. Если указано нулевое значение то рамка не отображается. Если этот параметр не указан, его значение считается нулевым (рамка не отображается).

WIDTH, HEIGHT - указывает размеры таблицы, если они должны быть жестко заданы.

ALIGN - определяет, как должна быть выровнена таблица: справа (RIGHT), слева (LEFT) или в центре (CENTER) страницы.

CELLSPACING - число точек между отдельными ячейками в таблице.

CELLPADDING - число точек между рамкой и содержимым ячейки.

С помощью тега <TR параметры>...</TR> оформляются строки таблиц.

Он может иметь следующие параметры:

ALIGN - используется для задания способа горизонтального форматирования данных внутри

ячеек: они могут прижиматься к правому (RIGHT), левому (LEFT) краям или

центрироваться (CENTER).

VALIGN - используется для задания способа вертикального форматирования данных внутри

ячеек: они могут прижиматься к верхнему (TOP), нижнему (BOTTOM) краям,

центрироваться (MIDDLE) или иметь общую базовую линию (BASELINE).

Конкретные ячейки задаются с помощью тега <TD параметры>...</TD>,

где параметры могут быть следующими:

WIDTH - задает ширину ячейки.

COLSPAN - определяет, сколько колонок таблицы ячейка будет перекрывать.

ROWSPAN - определяет, сколько строк таблицы ячейка будет перекрывать.

NOWRAP - если этот параметр указан, содержимое ячеек не будет переноситься, чтобы влезать в ширину ячейки.

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

Еще один тег для оформления ячеек таблиц - тег <TH>...</TH> - нужен для

задания заголовочных ячеек. Он во всем совпадает с тегом <TD>, но

в отличие от него, содержимое выдается жирным шрифтом и центрируется.

Если нужно задать заголовок ВСЕЙ таблицы, используйте тег

<CAPTION параметры>...</CAPTION>. Он должен быть внутри тега <TABLE>,

но вне описания ячеек. Тег имеет один параметр:

ALIGN - указывает положение заголовка: он может быть в верхней (TOP) или нижней (BOTTOM) части таблицы.

Пример:

<TABLE BORDER=1 CELLSPACING=2 CELLPADDING=1 WIDTH=500>

<TR>

<TD COLSPAN=3 ALIGN=CENTER>A</TD>

</TR>

<TR>

<TD ROWSPAN=2 ALIGN=CENTER WIDTH="30%">B</TD>

<TD ROWSPAN=2 ALIGN=CENTER WIDTH="40%">C</TD>

<TD ALIGN=CENTER WIDTH="30%">D</TD>

</TR>

<TR>

<TD ALIGN=CENTER>E</TD>

</TR>

</TABLE>