HTML <colgroup> タグ

前へ 完全なHTM リファレンス 次へ

<colgroup> と <col> タグで 3 列の背景色を設定します:

<table>
  <colgroup>
    <col span="2" style="background-color:red">
    <col style="background-color:yellow">
  </colgroup>
  <tr>
    <th>ISBN</th>
    <th>Title</th>
    <th>Price</th>
  </tr>
  <tr>
    <td>3476896</td>
    <td>My first HTML</td>
    <td>$53</td>
  </tr>
</table>
Try it Yourself ❯

定義と用法

<colgroup> タグは、書式設定のためにテーブルの 1 つ以上の列のグループを指定します。

<colgroup> タグは、行ごとに各セルのスタイルを繰り返すのではなく、列全体にスタイルを適用するのに便利です。

注: <colgroup> タグは、<caption> 要素の後で、 <thead>、<tbody>、<tfoot>、<tr> 要素の前に置く、 <table> 要素の子でなければなりません。

チップ: <colgroup> 内の列にいろいろなプロパティを定義するには、<colgroup> タグ内で <col> タグを使用します。


ブラウザ・サポート

要素
<colgroup> Yes Yes Yes Yes Yes

HTML 4.01 と HTML5 の相違点

HTML 4.01 の属性のほとんどは、HTML5 ではサポート対象外です。


属性

属性 説明
align left
right
center
justify
char
HTML5 ではサポート対象外。
列グループ内のコンテンツを配置する
char character HTML5 ではサポート対象外。
文字に列グループ内のコンテンツを揃える
charoff number HTML5 ではサポート対象外。
属性で指定した文字までの文字数を指定する
span number 列グループをまたがる列数を指定する
valign top
middle
bottom
baseline
HTML5 ではサポート対象外。
列グループ内のコンテンツの縦位置を揃える
width pixels
%
relative_length
HTML5 ではサポート対象外。
列グループの幅を指定する

グローバル属性

<colgroup> タグは、HTML のグローバル属性もサポートします。


イベント属性

<colgroup> タグは、HTML のイベント属性もサポートします。


関連ページ

HTML DOM リファレンス:ColumnGroup オブジェクト


デフォルトの CSS 設定

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

colgroup {
    display: table-column-group;
}
Try it Yourself ❯


前へ 完全なHTM リファレンス 次へ