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

Учебник по HTML 4

       

Выравнивание данных в столбцах HTML таблицы

Характерной проблемой при создании HTML таблиц является задание параметров выравнивания для отдельных строк или столбцов. Для выравнивания содержимого всех ячеек текущей строки достаточно задать требуемые параметры в коде <TR>. Однако чаще необходимо обеспечить одинаковое выравнивание для всех элементов одного столбца, так как в большинстве случаев в столбце располагаются однородные данные.

В ранних версиях HTML для этого предлагалось использовать параметр COLSPEC (COLumn SPECification), который задавался в теге <TABLE> и определял выравнивание и ширину каждой колонки таблицы. Для примера, задание colspec="L40 R50 C80" определяло для трех колонок таблицы выравнивание данных в ячейках: для первой колонки — LEFT, для второй — RIGHT и для третьей — CENTER, а также ширину каждой колонки. По мере развития языка HTML от использования этого параметра отказались, и в настоящее время он не входит в спецификацию языка и не поддерживается большинством браузеров. В итоге для решения такой задачи в Netscape Navigator не имеется специальных средств, и единственным вариантом остается либо использование выравнивания по умолчанию, либо задание соответствующих значений в каждой ячейке, где это необходимо.

В Microsoft Internet Explorer предусмотрены специальные теги — <COL> и <COLGROUP>. Эти теги должны располагаться сразу же за описанием <TABLE> перед первым появлением тега <TR>.

Параметрами тегов <COL> и <COLGROUP> могут быть SPAN, определяющий количество смежных колонок, на которые распространяется действие значений параметров, и ALIGN, определяющий горизонтальное выравнивание данных во всех ячейках соответствующего столбца (или столбцов). Допустимыми значениями параметра ALIGN являются LEFT, RIGHT и CENTER. Для параметра SPAN значение по умолчанию равно единице.

Тег <COLGROUP> дополнительно позволяет задавать параметр VALIGN, определяющий вертикальное выравнивание данных в ячейках. Допустимыми значениями параметра VALIGN являются MIDDLE, TOP и BOTTOM.

Различие между тегами <COLGROUP> и <COL> заключается в том, что первый из них, помимо задания параметров выравнивания данных для столбцов, выполняет также условное объединение нескольких столбцов в группу. Эффект такого объединения проявляется при использовании параметра RULES, который описывается ниже. По умолчанию все столбцы HTML таблицы считаются одной группой. Тег <COL> должен использоваться только для определения выравнивания данных в отдельных столбцах в группе.

Приведем пример. Пусть необходимо построить HTML таблицу, содержащую 6 столбцов, причем данные в первых трех из них должны быть выровнены вправо, а следующих трех — посередине. Для решения этой задачи следует записать такой фрагмент HTML-кода:

<TABLE>

<COLGROUP SPAN=3 ALIGN=RIGHT>

<COLGROUP SPAN=3 ALIGN=CENTER>

(данные для таблицы)

</TABLE>

Результат отображения этого кода показан на рис. 4.16.

Выравнивание данных в столбцах HTML таблицы

Рис. 4.16. HTML таблица с разными параметрами выравнивания данных в группах ячеек

Другой пример. Пусть в предыдущей таблице первые две колонки должны быть выровнены вправо, а третья — посередине, причем все три колонки необходимо объединить в группу. Последующие три колонки также должны быть объединены в группу и иметь выравнивание, аналогичное первой группе. Для решения этой задачи следует записать такой фрагмент HTML-кода:

<TABLE>

<COLGROUP>

<COL SPAN=2 ALIGN=RIGHT>

<COL ALIGN=CENTER>

<COLGROUP>

<COL SPAN=2 ALIGN=RIGHT>

<COL ALIGN=CENTER>

(данные для таблицы)

</TABLE>

В этом примере после тега <COLGROUP> задаются настройки отдельных столбцов данной группы. При этом в теге <COLGROUP> при необходимости могли бы быть заданы параметры выравнивания, значения которых распространяются на все столбцы данной группы. Значения параметров, заданные в теге <COL>, переопределяют значения из тега <COLGROUP>. Заметим, что в теге <COLGROUP> в данном примере, в отличие от предыдущего, отсутствует параметр SPAN. Здесь его употребление бессмысленно, так как количество элементов в группе будет определяться следующими за тегом <COLGROUP> тегами <COL>. Поэтому любое заданное значение параметра SPAN тега <COLGROUP> будет переопределено.

На рис. 4.17 показан результат реализации приведенного выше кода, а также вариант отображения такой таблицы с записью RULES=GROUPS в теге <TABLE>, из которого виден смысл объединения в группы.

Совет

Поскольку область применения тегов <COLGROUP> и <COL> ограничивается единственным браузером Microsoft Internet Explorer, то следует пользоваться ими с осторожностью. Удобство использования этих тегов очевидно, но на практике большинство таблиц строится с использованием соответствующего параметра выравнивания ALIGN для каждой ячейки таблицы, где это необходимо, что значительно увеличивает объем исходного кода таблицы, однако обеспечивает возможность просмотра в любом браузере.

Выравнивание данных в столбцах HTML таблицы

Рис. 4.17. HTML таблица с группированными столбцами

Рейтинг@Mail.ru