col « webmas.jp

col

<col> は列グループに含まれる1つ以上の列を示します。列グループは <colgroup> で作成し、<col> はこの要素の中に配置されます。

分類

なし
内包できるもの: 空

属性

span=””: グループ化する列数

グループ化する列数

<col> 要素に対し span 属性を指定し、複数の列をまとめることが可能です。省略した場合は span=”1″ が自動的に設定され1列になります。

<col span="2">

サンプル

<table>
 	<caption>表題</caption>
 	<colgroup>
 	 	<col />
 	 	<col class="group_01" span="2" />
 	 	<col class="group_02" span="2" />
 	</colgroup>
 	<tbody>
 		<tr>
	 		<td></td>
 	 		<th scope="col">列1</th>
	 	 	<th scope="col">列2</th>
 	 	 	<th scope="col">列3</th>
	  		<th scope="col">列4</th>
	 	</tr>
 	 	<tr>
 	 	 	<th scope="row">行1</th>
 	 	 	<td>データ1</td>
 	 	 	<td>データ2</td>
 	 	 	<td>データ3</td>
 	 	 	<td>データ4</td>
 	 	</tr>
 	</tbody>
</table>

グループが分かりやすいように CSS を適用してみます。

.group_01 {
background-color: #ccffff;
}

.group_02 {
background-color: #ffccff;
}

プレビュー

表題
	列1	列2	列3	列4
行1	データ1	データ2	データ3	データ4