<colgroup>の解説|クロノドライブのHTML辞典

<colgroup>

対応ブラウザ Internet Explorer 3~ Firefox 1~ Google Chrome 1~ Safari 1~ Opera 6~
タグの分類 table要素の子要素 定義バージョン
開始タグ 必須 終了タグ 省略可
用例
<table>
  <caption>表の題名</caption>
  <colgroup></colgroup>
  <thead>
    <tr>
      <th>見出し</th>
    </tr>
  </thead>
  <tfoot>
    <tr>
      <td>フッタセル1</td>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>内容1</td>
      <td>内容2</td>
    </tr>
  </tbody>
</table>

属性

span 概要 まとめる列数を指定します(初期値は 1)。
属性の値 列数
align 概要 表示位置を指定します。
属性の値 left、center、right、justify
valign 概要 垂直方向の位置を指定します。
属性の値 top、middle、bottom、baseline
width 概要 列の横幅を数値や%
属性の値 ピクセル数
%

<colgroup>とは

「COLGROUP」とは「column group」の略で、表の縦列の属性をまとめて指定したいときに使用するタグです。

<colgroup>タグを使用すると、テーブルのカラム(列)ごとにまとめて属性やスタイルシートを使用することができます。
カラムごとの幅を指定しておくことで、表データを読み込む際に横1行ずつ表示させることが可能です(ブラウザにより対応していない場合があります)。
<col>タグは、<table>タグ内の<caption>タグより後、<thead>タグより前に記述します。

よく似たタグに<col>があります。使い分けとしては、カラムグループには<colgroup>タグを、グループの中の個々のカラムについて指定したい場合は<col>タグを使用するのが一般的です。
ただし、明確には使い分けられてはいません。

サンプルデモ

		<table border="1">
			<caption>表の題名</caption>
			<colgroup align="center">
			<thead>
				<tr>
					<th>見出し1</th>
					<th>見出し2</th>
				</tr>
			</thead>
			<tfoot>
				<tr>
					<td>フッタセル1</td>
					<td>フッタセル2</td>
				</tr>
			</tfoot>
			<tbody>
				<tr>
					<td>内容1</td>
					<td>内容2</td>
				</tr>
			</tbody>
		</table>