Section 3 : 表組(3) ― 罫線

 Section 1Section 2 で表の行・列をグループ化する方法を見た。ここでは,そのグループ化を反映させる方法としての罫線の引かれ方や,スタイルシート(CSS1)で指定しない表の視覚的要素についても説明する。

RULES 属性

 行や列のグループ化を視覚的に反映させる方法として,罫線の引かれ方を変えるというものがある。これは,<TABLE>RULES 属性で指定する。

罫線の属性
属性 解説
RULES キーワード 表組の罫線の引かれ方を指定する。

これには,次のようなキーワードを与える。

none
罫線は引かない。
groups
グループ化された行や列の間にだけ罫線を引く。
rows
行間のみに罫線を引く。
cols
列間のみに罫線を引く。
all
すべての行および列間に罫線を引く。

ここで特筆すべきなのはキーワード groups を与えるときである。これによって,表の意味的な区切りの位置に罫線が引かれることになり,視覚的にいっそう見やすい表にすることができる。

 たとえば,Section 1 で例にあげた表の一部を次のように書き直して出力させてみよう。

<TABLE BORDER RULES="groups">
  <CAPTION>クォークの種類と基本的性質</CAPTION>
  <COLGROUP></COLGROUP>
  <COLGROUP></COLGROUP>
  <COLGROUP SPAN="4"></COLGROUP>
  <THEAD>
...(以下略)...

罫線に注目してご覧いただきたい。

クォークの種類と基本的性質
世代 粒子名質量 電荷スピンバリオン数
1 アップ0.31GeV 2/31/21/3
ダウン0.31GeV -1/31/21/3
2 チャーム1.5GeV 2/31/21/3
ストレンジ0.55GeV -1/31/21/3
3 トップ174GeV 2/31/21/3
ボトム5.5GeV -1/31/21/3

 RLUES 属性にさまざまな値を入れた表を作ってみよう。

 NN4  RULES 属性はサポートされない。

CELLSPACING,CELLPADDING 属性

 また,罫線に関連して次のような属性もある。

罫線に関連した属性
属性 解説
CELLSPACING ピクセル
パーセント
セルどうしの間隔を指定する。“罫線の太さ”で表現されることが多い。
CELLPADDING ピクセル
パーセント
セルの外縁から内容までの余裕を指定する。CSS の言葉を借りれば,セル外縁を枠としたときのパディングを指定する。

CELLPADDING 属性については,パーセント指定したとき注意が必要である。余裕は上下,左右ともに均等に割りふられるが,垂直方向と水平方向の余裕の量が状況に応じて異なる場合がある。

 先ほどの表の <TABLE> タグを次のように書き換えてみる。

<TABLE BORDER RULES="groups" CELLSPACING="0" CELLPADDING="5">

同じ表でも,ずいぶんと印象が変わって見える。

クォークの種類と基本的性質
世代 粒子名質量 電荷スピンバリオン数
1 アップ0.31GeV 2/31/21/3
ダウン0.31GeV -1/31/21/3
2 チャーム1.5GeV 2/31/21/3
ストレンジ0.55GeV -1/31/21/3
3 トップ174GeV 2/31/21/3
ボトム5.5GeV -1/31/21/3

CELLSPACING,CELLPADDING は罫線を描くか描かないかに関係なく確保されることに注意されたい。

 IE3,4,5,5.5/NN4  CELLSPACING および CELLPADDING 属性のパーセント指定はサポートされない。