≪ 目次　＜ 名前順要素一覧　［ 戻る ］　表の概説 ＞

バナー

中年おっちゃんでも出来た ウェブページ作成講座 with ? mark

COL要素 - 列の修飾
COLGROUP要素 - 列グループの修飾

table COLumn
COL要素は、表の縦列の修飾に使用します。
  • 空要素です。
  • COL要素の合計が表の縦列数と一致しなければ、ブラウザがどのように表示するかは、保証されません。
  • COL要素に定義されている属性は、全てのブラウザが全て実行出来るとはかぎりません。
  • DTDのATTLISTの内容はCOLGROUP要素と同じですので割愛します。
COLumnGROUP
COLGROUP要素は、表縦列をグループ分けして修飾します。
  • TABLT要素の子要素としてCOL要素を記述した場合、COLGROUP要素を記述できません。
  • グループ内の縦列の修飾が別途必要な場合は、COL要素を使用します。
  • COLGROUP要素の内容は０個以上のCOL要素のみです。
  • これらの要素の修飾する縦列数の合計が表の縦列数と一致しなければ、ブラウザがどのように表示するかは、保証されません。
  • COLGROUP要素に定義されている属性は、全てのブラウザが全て実行出来るとはかぎりません。

W3C → XHTML 1.0 → Multi-part XHTML file → DTDs → XHTML-1.0-Strict より

<!ELEMENT col      EMPTY>
<!ELEMENT colgroup (col)*>
<!ATTLIST colgroup
  %attrs;
  span        %Number;       "1"
  width       %MultiLength;  #IMPLIED
  %cellhalign;
  %cellvalign;  >

span属性

span        %Number;       "1"

セル縦列のグループ化。span="n" でｎ個の連なった縦列の修飾を同時行います。省略時は "1"
colgroup要素の子要素にcol要素が含まれる場合は、col属性で指定します。

使用例

　XXXX　　はHTMLサンプルです。

　XXXX　　はHTMLサンプルの表示例です。

HTML記述
<table summary="COL要素の使用例 - １" border="1">
<caption>COL要素の使用例 - １</caption>
<col width="100" /><col span="2" width="200" />
<tr>
<td>ABCD</td><td>EFGH</td><td>IJKLM</td>
</tr>
</table>
表示例
col属性の使用例 - １
ABCDEFGHIJKLM

上記例では、表縦列の巾を 100px 200px 200px に指定しています。

span属性の省略時は "1" なので、COL要素で修飾している縦列の合計は "3" になります。この数は、表縦列の数と一致しなければなりません。

HTML記述
<table summary="colgroup要素の使用例 - 2" border="1">
<caption>colgroup要素の使用例 - 2<caption>
<colgroup span="3" width="100"></colgroup>
<tr>
<td>ABCD</td><td>EFGH</td><td>IJKLM</td>
</tr>
</table>
表示例
colgroup要素の使用例 - 2
ABCDEFGHIJKLM

上記例では、表縦列の巾を 100px に統一しています。

COLGROUP要素で修飾している縦列は "3" です。この数は、表縦列の数と一致しなければなりません。

HTML記述
<table summary="colgroup要素の使用例 - 3" border="1">
<caption>colgroup要素の使用例 - 3</caption>
<colgroup width="100">
<col /><col span="2" align="right" />
</colgroup>
<colgroup span="2" width="50"></colgroup>
<tr>
<td>AB</td><td>CD</td><td>EF</td>
<td>GH</td><td>IJ</td>
</tr>
</table>
表示例
colgroup要素の使用例 - 3
ABCDEFGHIJ

上記例では、表縦列をCOLGROUP要素で３列と２列のグループに分けて修飾し、３列のグループはCOL要素で更に１列と２列のグループに分けて修飾しています。

COL要素を持つCOLGROUP要素には、span属性を記述できません。

width属性

表縦列の巾を ｐｘ、表示可能な幅の％、相対長で示します。省略時はブラウザにより決定されます。省略可。
px値を指定する場合は、100pxと記述するのではなく、100と整数値で指定します。

参照：巾や高さの単位

使用例

　XXXX　　はHTMLサンプルです。

　XXXX　　はHTMLサンプルの表示例です。

HTML記述
<table summary="相対比での幅指定使用例" border="1" width="50%">
<caption>相対比での幅指定使用例</caption>
<col width="1*"><col width="2*"><col width="3*">
<tr>
<td>ABCD</td><td>EFGH</td><td>IJKLM</td>
</tr>
</table>
表示例
相対比での幅指定使用例
ABCDEFGHIJKLM

IEでは相対比での幅指定は、反映されない様です。

Netscape Navigatorでの表示

NNでの表示では、相対比での幅指定は反映されていました。

≪ 目次　＜ 名前順要素一覧　［ 戻る ］　Top ↑

Created：Jun 01, 2005 Updated：Oct.,25,2011 © by おっちゃん
Oct.,25,2011 全面更新