Таблицы. На данном этапе развития методов форматирования Web-страниц таблицы являются мощнейшим средством компоновки контента

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

Для создания таблицы используются теги < TABLE> и < /TABLE>. Между этими тегами располагаются теги < TR> и < /TR>. Они окружают каждую строку таблицы. Если необходимо создать несколько строк в таблице, используется столько же тегов < TR> и < /TR>. В каждой строке таблицы обычно отображаются ячейки. Каждая ячейка должна быть окружена тегами < TD> и < /TD>. Количество этих тегов в строке определяет количество ячеек. Число ячеек в строках не обязательно должно быть одинаковым.

Для создания заголовков столбцов и строк вместо простой строки, создается заголовок и текст его размещается между тегами < TH> и < /TH>. Этот текст будет отображен жирным шрифтом и отцентрирован. Разрешается применить некоторые атрибуты.

Атрибут NOWRAP. Он используется в тегах < TH> и < /TH> или < TD> и < /TD> для того, что бы текст помещался в одной строке (ячейка при этом расширяется).

Атрибут COLSPAN=x. Если какая-нибудь ячейка должна быть шире вышерасположенных или нижерасположенных, то используется этот тег. Величина х указывает количество объединяемых горизонтальных ячеек.

Атрибут ROWSPAN=x. Этот атрибут аналогичен предыдущему, только он объединяет x вертикальных ячеек.

Атрибут WIDTH=x. Этот атрибут определяет ширину таблицы, если он задан в теге < TABLE>, ширину группы ячеек или ширину отдельной ячейки, если указан в тегах < TR> и < /TR> или < TH> и < /TH>. Величина х указывает ширину в пикселях или в процентах. Оптимальным значением является WIDTH=50%.

Атрибут UNIT=. Он применяется в теге < TABLE> для определения единицы измерения размеров в таблице. Атрибут принимает следующие значения:

UNIT=EN - в en-пробелах,

UNIT=RELATIVE - относительные значения в процентах от общей ширины таблицы,

UNIT=PIXELS - в пикселях, например < TABLE UNIT=PIXELS WIDTH=200> создает таблицу шириной в 200 пикселей.

Атрибут COLSPEC=. Используется с атрибутом UNIT=. Он определяет, сколько места занимает каждый столбец таблицы и тип выравнивания данных. Применяется только в теге < TABLE>. В атрибуте COLSPEC= перечисляются все столбцы. Для каждого задаётся выравнивание одним из пяти типов: L - по левому краю, С - по центру, R - по правому краю, J - по правому и левому краю, D - по десятичной запятой. Размер задаётся в пикселях. Например, тег < TABLE UNIT=PIXELS COLSPEC=" L10 C20 R10" > определяет таблицу, в которой первая ячейка имеет ширину в 10 пикселей и выравнивание по левому краю, вторая - 20 пикселей и выравнивание по центру, третья - 10 пикселей, выравнивание по правому краю.

Атрибут DP=. Определяет символ, используемый для отделения целой части десятичной дроби. По умолчанию используется тег DP=".", определяющий в качестве разделителя точку. Атрибут DP=", " задает запятую.

Атрибут CELLPADDING=x. Определяет поле вокруг содержимого ячейки. Величина х задает число пикселей.

Атрибут ALIGN=. Используется в тегах < TR>, < TD>, < TH>. Он определяет выравнивание содержимого по горизонтали. Значения атрибута могут быть следующими:

ALIGN=LEFT - выравнивает содержимое ячейки по левому краю,

ALIGN=CENTER - по центру,

ALIGN=RIGHT - по правому краю,

ALIGN=BLEEDLEFT - предыдущие значения учитывали отступ, заданный атрибутом CELLPADDING. При задании этого атрибута содержимое ячейки прижимается вплотную к левому краю.

Атрибут VALIGN=. Сходен с предыдущим, но задает выравнивание по вертикали. Значения:

VALIGN=TOP - выравнивание содержимого по верхней границе,

VALIGN=MIDDLE - центрирует по вертикали,

VALIGN=BOTTOM - выравнивает по нижней границе.

Для создания заголовков таблицы существует тег < CAPTION>. Заголовок может быть над таблицей (< CAPTION ALIGN=TOP>), или под таблицей (< CAPTION ALIGN=BOTTOM>). Заголовком может быть текст или графика. Этот тег хорош для создания подписей под рисунками, заключенными в таблицу без границ.

Основной частью таблицы являются границы ячеек. Для управления толщиной границ используется атрибут BORDER=x. Можно сделать таблицу вообще без границ, задав атрибут в теге < TABLE BORDER=0>. Читатель страницы даже не будет знать, как получена такая точная компоновка содержимого. Напротив, толстые границы привлекают внимание к таблице. Можно задать красивую толстую рамку вокруг картинки, она будет похожа на настоящую рамку.

Для задания толщины промежутков между ячейками используется атрибут CELLSPACING=x. По умолчанию x=2 пикселям. Этот атрибут хорошо использовать вместе с атрибутом BORDER= для задания красивых рамок вокруг изображений.

С помощью таблиц можно сделать красивые выпуклые панели с графикой или текстом.

Пример 5.

< HTML>

< HEAD>

< TITLE>

Простая таблица

< /TITLE>

< /HEAD>

< BODY>

< TABLE BORDER=3>

< CAPTION ALIGN=CENTER> Мои друзья< / CAPTION>

< TR>

< TH> Имя< /TH>

< TH> Год рождения< /TH>

< TH> Курс< /TH>

< /TR>

< TR>

< TD> Ольга< /TD>

< TD> 1980< /TD>

< TD> 5< /TD>

< /TR>

< TR>

< TD> Марина< /TD>

< TD> 1982< /TD>

< TD> 3< /TD>

< /TR>

< TR>

< TD> Игорь< /TD>

< TD> 1982< /TD>

< TD> 4< /TD>

< /TR>

< /TABLE>

< /BODY>

< /HTML>