Онлайн учебники на TEPKA.ru

Учебник по HTML 4

       

HTML теги структурирования таблицы <THEAD>, <TBODY> и <TFOOT>

Браузер Microsoft Internet Explorer позволяет использовать ряд новых тегов для структурирования таблиц и гибкого управления прорисовкой рамок и линий сетки.

HTML теги <THEAD>, <TBODY> и <TFOOT> более строго задают структуру описания таблицы, выделяя ячейки заголовка таблицы, основное содержимое таблицы и итоговую строку. Эти теги могут встречаться только в описании таблиц внутри пары тегов <TABLE> и </TABLE>.

HTML теги <THEAD> и <TFOOT> используются для описания верхнего и нижнего колонтитулов таблицы. Эти теги могут встречаться в таблице не более одного раза. Завершающий тег для них можно опускать. Использование данных тегов удобно при создании больших таблиц, выходящих за пределы одной страницы.

Тег <TBODY> может встречаться многократно в описании HTML таблицы, при этом требуется использование завершающего тега </TBODY>. Этот тег выполняет логическое группирование данных так же, как и тег <COLGROUP>, выполняющий группирование смежных столбцов.

При использовании новых тегов появляется возможность более гибко управлять рамками и линиями сетки таблицы.

Управление прорисовкой рамок вокруг HTML таблицы осуществляется параметром FRAME тега <TABLE>, а линий сетки таблицы — параметром RULES. Например, становится возможным провести только вертикальные линии между колонками и вместо рамки вокруг всей таблицы дать горизонтальные линии сверху и снизу таблицы.

Параметр FRAME может принимать следующие значения:

  • BOX или BORDER — рамка рисуется со всех четырех сторон
  • ABOVE — только с верхней стороны
  • BELOW — только с нижней стороны
  • HSIDES — рисуется нижняя и верхняя сторона
  • VSIDES — рисуется левая и правая сторона
  • LHS — только с левой стороны
  • RHS — только с правой стороны
  • VOID — таблица без внешних рамок

Параметр RULES управляет прорисовкой внутренних линий сетки HTML таблицы и может принимать следующие значения:

  • ALL — рисуются все внутренние линии
  • GROUPS — рисуются только линии, разделяющие группы
  • ROWS — рисуются линии, разделяющие строки
  • COLS — рисуются линии, разделяющие столбцы
  • NONE — внутренние линии не рисуются

Пример: <TABLE BORDER FRAME=HSIDES RULES=GROUPS>.

Примечание

Прорисовка линий сетки таблицы и рамок будет осуществляться только при наличии параметра BORDER тега <TABLE>. При отсутствии этого параметра или его нулевом значении линии сетки и рамки будут отсутствовать при любых значениях параметров FRAME и RULES.

Приведем пример полного HTML-кода, создающего таблицу с использованием описанных возможностей:

<HTML>

<HEAD>

<TITLE>Выделение заголовка и итоговой строки</TITLE>

</HEAD>

<BODY>

<TABLE BORDER=5 WIDTH=100% RULES=GROUPS FRAME=HSIDES>

<COLGROUP ALIGN=CENTER>

<COLGROUP ALIGN=CENTER>

<COLGROUP ALIGN=CENTER>

<CAPTION><H3>

Пример гибкого управления линиями<BR>сетки таблицы</H3>

</CAPTION>

<THEAD>

<TR>

<TH>Заголовок столбца 1</TH>

<TH>Заголовок столбца 2</TH>

<TH>Заголовок столбца 3</TH>

</TR>

</THEAD>

<TBODY>

<TR><TD>Данные</TD><TD>Данные</TD><TD>Данные</TD></TR>

<TR><TD>Данные</TD><TD>Данные</TD><TD>Данные</TD></TR>

<TR><TD>Данные</TD><TD>Данные</TD><TD>Данные</TD></TR>

<TR><TD>Данные</TD><TD>Данные</TD><TD>Данные</TD></TR>

<TR><TD>Данные</TD><TD>Данные</TD><TD>Данные</TD></TR>

<TR><TD>Данные</TD><TD>Данные</TD><TD>Данные</TD></TR>

</TBODY>

<TFOOT>

<TR><TD>Итог</TD><TD>Итог</TD><TD>Итог</TD></TR>

</TFOOT>

</TABLE>

</BODY>

</HTML>

HTML теги структурирования таблицы THEAD, TBODY, TFOOT

Рис. 4.18. Гибкая прорисовка линий сетки HTML таблицы браузером Microsoft Internet Explorer

В этом примере, отображение которого браузером представлено на рис. 4.18, показывается один из возможных вариантов управления линиями сетки и рамками вокруг таблицы. Вокруг таблицы рисуется рамка толщиной 5 пикселов (BORDER=S) только с верхней и нижней стороны (FRAME=HSIDES). Внутри таблицы рисуются линии сетки, разделяющие группы данных (RULES=GROUPS). Группы данных определены, во-первых, наличием трех тегов <COLGROUP ALIGN=CENTER>, каждый из которых объявляет отдельный столбец таблицы группой. Во-вторых, теги <THEAD>, <TBODY> и <тгоот> также разбивают данные HTML таблицы на группы, что определяет прорисовку внутренних горизонтальных линий.

Рейтинг@Mail.ru