<colgroup>

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

Обычно закрывающий тег не требуется, но если <colgroup> выступает как контейнер для элементов <col>, тогда следует добавить тег </colgroup> в конце группы.

Разница между свойствами <colgroup> и <col> не очень велика и состоит в следующем. <colgroup> позволяет объединять колонки в определённые группы, также при добавлении атрибута rules="groups" к элементу <table> браузер будет рисовать линию только между колонками, созданными с помощью <colgroup>. В остальных случаях поведение колонок назначенных через элементы <colgroup> и <col> идентично.

Для <colgroup> допустимо использовать следующие стилевые свойства: border, background, width, visibility. Остальные свойства не оказывают никакого эффекта на элемент.

Закрывающийся тег:

Не обязателен

Поддержка:

HTML4 и выше

Атрибуты:

align - Устанавливает выравнивание содержимого колонки по краю.
char - Выравнивает содержимое колонки по заданному символу.
charoff - Сдвигает содержимое ячейки относительно заданного символа.
span - Количество колонок, к которым следует применять атрибуты.
valign - Задает вертикальное выравнивание содержимого колонки.
width - Ширина колонок.

Пример:

<!DOCTYPE HTML>
<html>
 <head>
   <meta charset=ru">
   <title>COLGROUP</title>
 </head>
 <body> 
  <table width="80%" cellpadding="2" cellspacing="0" border="2" rules="groups">
   <tr> 
     <td>Цвет</td><td>RGB</td><td>Код для HTML</td><td>HSB эквивалент</td>
   </tr>
   <colgroup width="150">
   <colgroup span="10" align="center" width="50">
     <col span="5">
     <col span="4">
   </colgroup>
   <tr> 
     <td>Snow</td><td>255 250 250</td><td>#FFFAFA</td><td>HSB 0/2/100</td>
   </tr>
   <tr>
     <td>Navy Blue</td><td>0 0 205</td><td>#0000CD</td><td>HSB 240/100/80</td>
   </tr>
   <tr>
	<td>SpringGreen</td><td>0 255 127</td><td>#00FF7F</td><td>HSB 90/100/99</td>
   </tr>
  </table>
 </body>
</html>