HTML <colgroup> タグ

定義と使用方法

<colgroup> タグは、テーブル内に一列または複数の列を含むグループのフォーマットを指定するために使用されます。

すべての列にスタイルを適用するには、<colgroup> タグは非常に便利で、各ユニットや各行にスタイルを繰り返し適用する必要はありません。

注意：<colgroup> タグは、 <table> 要素の子要素は、任何 <caption> 要素の後にそれ以降の任何 <thead>、<tbody>、<tfoot> および <tr> 要素の前に。

ヒント：を設定するには、 <colgroup> の特定の列に異なる属性を定義するには、 <colgroup> タグ内で使用 <col> タグ。

も参照してください：

HTML リファレンスマニュアル：<col> タグ

HTML DOM リファレンスマニュアル：ColumnGroup オブジェクト

例

使用 <colgroup> と <col> タグで三列の背景色を設定します：

<table>
  <colgroup>
    <col span="2" style="background-color:red">
    <col style="background-color:yellow">
  </colgroup>
  <tr>
    <th>ISBN</th>
    <th>タイトル</th>
    <th>価格</th>
  </tr>
  <tr>
    <td>3476896</td>
    <td>HTML 入門</td>
    <td>$53</td>
  </tr>
</table>

実際に試してみる

属性

属性 値 説明
span 数字 列グループが横跨すべき列数を指定します。

グローバル属性

<colgroup> タグは以下のイベント属性もサポートしています HTMLでのグローバル属性。

イベント属性

<colgroup> タグは以下のイベント属性もサポートしています HTMLでのイベント属性。

デフォルトの CSS 設定

ほとんどのブラウザは以下のデフォルト値を使用して表示します <colgroup> 要素：

colgroup {
  display: table-column-group;
}

実際に試してみる

ブラウザのサポート

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
サポート サポート サポート サポート サポート