HTML5|on Note

HTML5で使用する要素

on Note

col要素

col要素は、table要素内のcolgroup要素により表される列グループ内で、1つ以上の列を示す。span属性で「2」以上の整数を指定することで、列を複数選択できる。これにより、複数の列に対し、CSSを使ってまとめてスタイルを適用させることができる。

col要素はコンテンツを持たない空要素。またcol要素は、colgroup要素内でのみ使用できる、span属性を持たないcolgroup要素の子要素である。

col要素は、colgroup要素同様、列単位でまとめてスタイルを設定できるわけだが、colgroup要素の場合は、複数の列を意味のあるグループとして定義できる

col要素で指定できる属性

span属性
span="数値"
列の数を1以上の整数で指定。
グローバル属性
グローバル属性参照。

col要素の記述例

col要素を使い、列範囲にスタイルを適用する。

<table border="">
<caption>テーブルタイトル</caption>
<colgroup>
<col span="2" class="abc">
</colgroup>
<tbody>
(省略)
</tbody>
</table>

col要素を使い、1つの列(2番目の列)にスタイルを適用する。

<table border="">
<caption>テーブルタイトル</caption>
<colgroup>
<col><col class="xyz">
</colgroup>
<tbody>
(省略)
</tbody>
</table>
メニュー