Заголовок и секции таблицы

Заголовок и секции таблицы

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

Прежде всего, с помощью парного тега <CAPTION> мы можем дать таблице заголовок. Текст заголовка помещают внутрь этого тега, который, в свою очередь, находится внутри тега <TABLE> (листинг 5.7).

Листинг 5.7

<TABLE>

<CAPTION>Это таблица</CAPTION>

<TR>

<TH>Столбец 1</TH>

<TH>Столбец 2</TH>

<TH>Столбец 3</TH>

</TR>

.

</TABLE>

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

<CAPTION><STRONG>Это таблица<STRONG></CAPTION>

Обычно тег <CAPTION> помещается сразу после открывающего тега <TABLE> — так логичнее. Но не имеет значения, в каком месте HTML-кода таблицы он присутствует — заголовок все равно будет помещен Web-обозревателем над таблицей.

Кроме того, мы можем логически разбить таблицу HTML на три значащие части — секции таблицы:

— секцию заголовка, в которой находится строка с ячейками заголовка, формирующая ее "шапку";

— секцию тела, где находятся строки таблицы, составляющие основные данные;

— секцию завершения со строками, формирующими "поддон" таблицы (обычно в "поддоне" располагают итоговые данные и различные примечания).

Секцию заголовка таблицы формирует тег <THEAD>, секцию тела — <TBODY>, а секцию завершения — <TFOOT>. Все эти теги парные, помещаются непосредственно в тег <TABLE> и содержат теги <TR>, формирующие строки таблицы, которые входят в соответствующую секцию (листинг 5.8).

Листинг 5.8

<TABLE>

<THEAD>

<TR>

<TH>Столбец 1</TH>

<TH>Столбец 2</TH>

<TH>Столбец 3</TH>

</TR>

</THEAD>

<TBODY>

<TR>

<TD>Ячейка 1.1</TD>

<TD>Ячейка 1.2</TD>

<TD>Ячейка 1.3</TD>

</TR>

<TR>

<TD>Ячейка 2.1</TD>

<TD>Ячейка 2.2</TD>

<TD>Ячейка 2.3</TD>

</TR>

</TBODY>

<TFOOT>

<TR>

<TD>Итог по ячейке 2.1</TD>

<TD>Итог по ячейке 2.2</TD>

<TD>Итог по ячейке 2.3</TD>

</TR>

</TFOOT>

</TABLE>

Секции таблицы Web-обозреватель никак не отображает и не выделяет на Web- странице. Они просто делят таблицу на три логические части. Однако мы можем задать для тегов, формирующих секции таблицы, какое-то представление, которое будет управлять их отображением. Подробнее об этом мы узнаем в части II.

НА ЗАМЕТКУ

Тег <TABLE> поддерживает необязательный атрибут SUMMARY, с помощью которого мы можем задать примечание к таблице. Это примечание вообще не показывается на экране, однако может использоваться другими средствами вывода Web-страниц, например, Web-обозревателями для слабовидящих, зачитывающими содержимое Web- страниц. Так или иначе, примечание к таблицам практически никогда не задается.

Чтобы закрепить полученные знания, давайте применим их к таблице — списку версий HTML, который мы недавно создали на Web-странице index.htm. Над этой таблицей мы вставили абзац с текстом "Список версий HTML: ", который так и просится в заголовки. Заодно разделим таблицу на секции заголовка и тела. ("Поддона" наша таблица не имеет, так что обойдемся без секции завершения.)

В листинге 5.9 представлен исправленный фрагмент HTML-кода Web-страницы index.htm, который создает эту таблицу.

Листинг 5.9

.

<P>Пожалуй, ни убавить ни прибавить…</P>

<HR>

<TABLE>

<CAPTION>Список версий HTML:</CAPTION>

<THEAD>

<TR>

<TH>Версия HTML</TH>

<TH>Год выхода</TH>

<TH>Особенности</TH>

</TR>

</THEAD>

<TBODY>

<TR>

<TD>1.0</TD>

<TD>1992</TD>

<TD>Официально не была стандартизована</TD>

</TR>

.

<TR>

<TD>5.0</TD>

<TD>?</TD>

<TD>В разработке</TD>

</TR>

</TBODY>

</TABLE>

<P>HTML позволяет формировать на Web-страницах следующие элементы:</P>

.

Сохраним исправленную Web-страницу и откроем ее в Web-обозревателе. И сразу увидим, что текст "Список версий HTML" теперь выровнен по центру таблицы. Это и неудивительно — ведь мы превратили его в заголовок таблицы. Сама же таблица ничуть не изменилась (что тоже понятно — ведь ее секции Web-обозреватель никак не выделяет).

Данный текст является ознакомительным фрагментом.



Поделитесь на страничке

Похожие главы из других книг:

Содержимое, разбивающее на секции

Из книги автора

Содержимое, разбивающее на секции Используя элементы заголовков, от h1 дo h6, можно создать содержание HTML-документа. Например, посмотрите вот на эту разметку:<h1>An Event Apart</h1><h2>Города</h2><p>Присоединяйтесь к нам в 2010 году в этих


Секции Web-страницы

Из книги автора

Секции Web-страницы Снова вернемся в полному HTML-коду нашей Web-странички. Мысленно удалим из него уже рассмотренный фрагмент и получим листинг 1.4. Листинг 1.4 <!DOCTYPE html> <HTML> <HEAD> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8"> <TITLE>Пример


Заголовок и секции таблицы

Из книги автора

Заголовок и секции таблицы Теперь рассмотрим дополнительные возможности HTML по созданию таблиц. На практике они применяются нечасто, но иногда могут пригодиться.Прежде всего, с помощью парного тега <CAPTION> мы можем дать таблице заголовок. Текст заголовка помещают


Заголовок EPA

Из книги автора

Заголовок EPA Заголовок ЕРА содержится в базовом сегменте всякого системного объекта и содержит следующую информацию об объекте:байт атрибутов:постоянный ли;подвешенный ли;поврежден ли;присутствует ли группа доступа;трассируется ли;участвует ли в


Секции Web-страницы

Из книги автора

Секции Web-страницы Снова вернемся в полному HTML-коду нашей Web-странички. Мысленно удалим из него уже рассмотренный фрагмент и получим листинг 1.4. Листинг 1.4 <!DOCTYPE html> <HTML> <HEAD> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8"> <TITLE>Пример


9.4.1 Заголовок UDP

Из книги автора

9.4.1 Заголовок UDP На рис. 9.3 представлен формат заголовка UDP. Заголовок содержит 16-разрядные номера портов источника и назначения, определяющие конечные точки коммуникации. Поле длины определяет общее количество октетов в заголовке и части для данных сообщения UDP. Поле


10.8 Заголовок TCP

Из книги автора

10.8 Заголовок TCP На рис. 10.14 показан формат сегмента (заголовок TCP и данные). Заголовок начинается с идентификаторов портов источника и назначения. Следующее далее поле порядкового номера (sequence number) указывает позицию в исходящем потоке данных, которую занимает данный


5.2.1.2. Секции ServerFlags

Из книги автора

5.2.1.2. Секции ServerFlags Секция ServerFlags (листинг 5.2) позволяет вам указать различные флаги для Х-сервера.Листинг 5.2. Секция ServerFlagsSection "ServerFlags"  Option "AIGLX" "on" EndSectionВcе флаги сервера задаются с помощью директивы Option. Некоторые (наиболее полезные) флаги представлены в табл. 5.1. Для


5.2.1.5. Секции Monitor и Modes

Из книги автора

5.2.1.5. Секции Monitor и Modes В данной секции описывается монитор. Обратите внимание на параметр Identifier, задающий идентификатор монитора (листинг 5.6). В вашем файле конфигурации может быть описано несколько мониторов, но к секции Screen будет определен только один монитор. Чтобы


Заголовок

Из книги автора

Заголовок Необходимо придумать интересный заголовок и/или слоган, например, как это реализовано у нас: «25-й час. Экстремальный тайм-менеджмент. У вас больше времени, чем вы думаете».Что важно в заголовке? Во-первых, он должен быть конкретным, чтобы люди сразу понимали, о чем


Заголовок

Из книги автора

Заголовок Раньше в интернет-магазинах было модно писать в заголовке под шапкой сайта фразы типа «Добро пожаловать в наш интернет-магазин!», «Мы любим и ценим наших покупателей», «У нас лучшее соотношение цены и качества» и т. п.Однако вскоре их владельцы поняли (к


4.4. Синхронизация потоков и критические секции

Из книги автора

4.4. Синхронизация потоков и критические секции Программирование потоков — нетривиальная задача, ведь большинство потоков выполняется одновременно. К примеру, невозможно определить, когда система предоставит доступ к процессору одному потоку, а когда — другому.


Параллельные секции и директива parallel sections

Из книги автора

Параллельные секции и директива parallel sections Директива parallel sections обеспечивает параллельное выполнение нескольких операторов, простых или составных. {$omp parallel sections} begin секция 1; секция 2; ...; end; Каждый оператор в блоке begin ... end, следующем за директивой является отдельной