最終更新日
colgroup要素は、列をまとめて1つのグループにします。列をグループ化することで、その列に意味を持たせられるほか、CSSを使ってグループ単位でスタイルを変えたりすることが可能です。グループ化の対象とする列は、colgroup要素のspan属性、またはcol要素で指定します。
span属性を使う場合は、値として1以上の整数を指定します。その場合、colgroup要素は子要素やコンテンツを持たない空要素となります。
子要素にcol要素を含める場合は、グループに含める各列をcol要素で指定します。colgroup要素のspan属性は指定しません。
colgroup要素の終了タグは、colgroup要素の直後がスペース文字かコメントでなければ省略可能です。
また、colgroup要素の開始タグは、colgroup要素がcol要素で始まる場合で、直前に終了タグが省略された別のcolgroup要素が置かれていなければ、省略可能です。
colgroup要素は、table要素内でcaption要素の後ろ、thead、tbody、tfoot、trの各要素の前に記述します。
カテゴリ | タグの省略 | 親要素 | 子要素 |
---|---|---|---|
なし | 省略可能 | table |
span属性あり:なし span属性なし:col |
属性 | 値 | 説明 |
---|---|---|
span | 数値 | 列の数を整数で指定します。 |
グローバル属性 | - | - |
イベント属性 | - | - |
<body> <table border="1"> <caption>料金表</caption> <colgroup span="2"> <tbody> <tr> <th>商品名</th> <th>料金</th> </tr> <tr> <td>ハンバーガー</td> <td>100円</td> </tr> <tr> <td>チーズバーガー</td> <td>120円</td> </tr> </tbody> </table> </body>