HTML5における＜col＞タグの使い方

<col>タグは、表の縦列に、属性やスタイルを指定するタグです。似たものに、<colgroup>要素がありますが、表の縦列をグループ化して属性やスタイルを適用する<colgroup>に対して、<col>要素は、グループ化せずに、複数の表の縦列のスタイルや属性をまとめて指定することができるものです。

今回は、HTML5における<col>タグの使い方をご紹介します。

HTML5における<col>タグの使い方

<col>要素は、span属性で、列数を指定して使用します。その際、必ず<colgroup>〜</colgroup>の中に配置します。<colgroup>自体がspan属性を持っている場合、<col>は配置することができません。

サンプルコードです。span属性を指定しない以下の場合は、1列指定になります。終了タグ</col>は省略できます。

2列以上まとめて指定したい場合は、以下の様に記述します。

更に、幾つか指定を行う場合は以下の様に記述します。試しに数字を入れてみます。

上記の様に記述した場、列数は全部で８です。

直接スタイリングすることもできますが、CSSでスタイリングしたい場合は、以下の様に、idをつけてCSSにスタイルを記述しましょう。