ここまでは、主に <TABLE> タグに付けるオプションの説明でした。次に、<TD> タグに付けるオプションを紹介します。<TD>〜</TD> は、一つのセルを定義するタグなので、<TD> に付くオプションは、そのセルにだけ作用します。

● セル内のコンテンツの位置（横）

何も指定しないと、セルの内容は左揃えで表示されます。中央揃えや右揃えにしたい場合に、<TD> タグに ALIGN というオプションを付けます。<TD ALIGN="center">と指定したセルの中身は中央揃えになり、"left" なら左揃え、"right" なら右揃えになります。

● セル内のコンテンツの位置（縦）

上下の位置に関しては、何も指定しないと、セルの内容はセルの中央に表示されます。セルの上端や下端に揃えたい場合に、<TD> タグに VALIGN というオプションを付けます。<TD VALIGN="top"> と指定したセルの中身は上揃えになり、"middle" なら中央揃え、"bottom" なら下揃えになります。

● セル内の改行を禁止する

セル内に書かれた文章は、セルの幅（ブラウザが自動的に適当な幅を決める）におさまるように改行されます。この自動的な改行を行わせたくない場合には、<TD> タグに NOWRAP というオプションをつけます。<TD NOWRAP>〜</TD> というタグで定義されたセルの中では、自動的な改行は行われません。

● 複数欄／複数行にまたがるセル

こういう表では、「人数」のセルが二つの欄にまたがっていて、「地名」の欄が二つの行にまたがっています。複数の欄にまたがるセルを作るには、そのセルを定義する <TD> タグに COLSPAN というオプションを付けます。<TD COLSPAN="2"> だと、二つの欄にまたがるセルができます。

複数の行にまたがるセルを作るには、そのセルを定義する <TD> タグに ROWSPAN というオプションを付けます。<TD ROWSPAN="2"> だと、二つの行にまたがるセルができます。数に矛盾がないように、正しく指定してください。

上の例の場合、ソースは次のようになります。

<TABLE BORDER>
	<TR>
		<TD ROWSPAN="2">地名</TD>
		<TD COLSPAN="2">人数</TD>
	</TR>
	<TR>
		<TD>男</TD>
		<TD>女</TD>
	</TR>
	<TR>
		<TD>西町</TD>
		<TD>12</TD>
		<TD>10</TD>
	</TR>
	<TR>
		<TD>東町</TD>
		<TD>3</TD>
		<TD>14</TD>
	</TR>
</TABLE>

● 見出し

テーブルの上端や左端のセルは、見出し項目として使うことが多いですが、その場合には <TD>〜</TD> タグではなく <TH>〜</TH> タグを使って見やすくする方法があります。<TH> と <TD> は、使い方もオプションもまったく同じですが、<TH> で定義したセルの中は太字になり、上下にも左右にも中央揃えになるという点が違っています。

● テーブルの背景の色

テーブルの所だけ、ページ全体の背景とは違った色の背景を指定することができます。それには <TABLE> タグに BGCOLOR というオプションを付けます。指定方法は、ページ全体の背景を指定するときと同じで、たとえば <TABLE BGCOLOR="#FF0000">にすると、そのテーブルの背景が赤になります。

この機能は、ネスケの２では使えません。ですから、色が表示されないブラウザでも困らないように、慎重に指定したほうが良いでしょう。よくある間違いは、たとえばページの背景が白で、文字色が黒のときに、テーブルの背景を紺にして、中の文字を白にするというやつです。綺麗に白抜きになって恰好いいのですが、テーブルの背景色を表示できないネスケ２などで見ると、白地に白文字ですから、なにも読めません。

● セルの背景の色

<TD> タグに BGCOLOR オプションを付けると、そのセルの背景だけ、色が変わります。この機能も、うまく使うととても綺麗ですが、ネスケ２などでは使えないので注意しましょう。同様に <TR> タグにも BGCOLOR オプションを使うことができます。その場合には１行全体に作用します。

あと、BACKGROUND オプションを使って、テーブルの背景やセルの背景に画像を貼ることもできますが、この機能を使えるのは新しいブラウザだけに限られているので、説明は省きます。テーブルの枠線の色を指定することもできますが、これも説明は省きます。

● セルの中にまたテーブルを作る

テーブルのセルの中には、文章だけでなく画像も置けるし、たいていのタグが有効に働きます。もちろん、セルの中にまた別のテーブルを書き込むこともできます。あまりにも深い入れ子にすると、表示が遅くなったりもしますが、３重〜４重の入れ子になったテーブルは、よくあります。某所で７重ってのを見ましたが(^^;

● とてもでかいテーブル

これは、作らないほうが良いです。ブラウザは、いったん <TABLE> を受信すると、</TABLE> が来るまで画面を構成することができないので、テーブルの中身が何百行もあったり、巨大な画像をいくつも含むテーブルを作ったりすると、数十秒（ときには数分）もの間、空白のままで見る人を待たせることになります。適当な所で区切るようにしましょう。

目次

翻訳フォーラムのトップページ