Guide to HTML 3.2
　- Wilbur -

TD - Table Data cell

テーブル・データ・セル

TDタグはTHタグと同じようにTR (Table Row) の中でデータ・セルを作る際に使用されます。クローズ・タグはオプションです。TDタグとTHタグには同じアトリビュートが使用されます。

Example:

<TABLE BORDER=2>
  <TR>
    <TD>a</TD><TD>bb</TD><TD>ccc</TD>
  </TR>
  <TR>
    <TD>dddd</TD><TD>eeeee</TD><TD>ffffff</TD>
  </TR>
</TABLE>

Attributes

NOWRAP - (e.g. <TD NOWRAP>)

テーブルでは各セルに書き込まれるテキストの改行は自動的になされますが、 TDタグにNOWRAPを入れると改行はされなくなり、テキストは一行で表示されます。セル内で任意に改行を行う場合はこのアトリビュートとBRタグを使います。

ROWSPAN - (e.g. <TD ROWSPAN=2>)

セルを複数のTable Row（横列）にまたがせる際につかいます。nには数字が入り、これはTable Rowの数を表わします。
例えば、ROWSPAN＝２と入れた場合は、次（下）の段のRowにまでセルを拡げ、 ROWSPAN＝３を入れた場合は三つ目のRowにまで拡がります。拡がる方向は次にくるRowに向かい、手前にあるRowはそのままです。

Example:

<TABLE BORDER=2>
  <TR>
     <TD>aaaaa</TD> <TD>bbbbb</TD> <TD>ccccc</TD>
  </TR>
  <TR>
    <TD>ddddd</TD> <TD ROWSPAN=2>eeeee</TD><TD>fffff</TD>
  </TR>
  <TR>
      <TD>ggggg</TD> <TD>hhhhh</TD>
  </TR>
</TABLE>

ROWSPANの例

aaaaa	bbbbb	ccccc
ddddd	eeeee	fffff
ggggg		hhhhh

COLSPAN - (e.g. <TD COLSPAN=2>)

COLはColumn（縦の列）の略で、これはROWSPANとは逆に指定されたColumnの数だけセルを拡げます。これも次にくるColumnに向かって拡がります。

Example:

<TABLE BORDER=2>
  <TR>
     <TD>aaaaa</TD> <TD>bbbbb</TD> <TD>ccccc</TD>
  </TR>
  <TR>
    <TD>ddddd</TD> <TD COLSPAN=2>eeeee</TD>
  </TR>
  <TR>
     <TD>fffff</TD> <TD>ggggg</TD> <TD>hhhhh</TD>
  </TR>
</TABLE>

COLSPANの例

aaaaa	bbbbb	ccccc
ddddd	eeeee
fffff	ggggg	hhhhh

ALIGN - (e.g. <TD ALIGN=center>)

セルに入っているデータの水平方向（左右）のアライメントに使われます。
一つのTable Rowに入っている全てのセルのテキスト・アライメントはTRにALIGNアトリビュートを入れて指定できますが、各セルごとにテキストのアライメントを変えたい場合にはTDにALIGNを入れてコントロールすることが出来ます。
TDにALIGNを入れた場合はTRに入ったALIGNのヴァリューは無効になります。
ALIGNのヴァリュー(Value)は、LEFT, CENTER, RIGHTの三つです。ディフォルト(Default)はLEFTです。

Example:

<TABLE BORDER=2>
  <TR>
     <TD ALIGN=CENTER>a</TD> <TD>b</TD> <TD>c</TD>
  </TR>
  <TR>
     <TD>ddddd</TD> <TD>eeeee</TD> <TD>fffff</TD>
  </TR>
</TABLE>

ALIGNの例

a	b	c
ddddd	eeeee	fffff

VALIGN

VはVertical（垂直）の略です。これはセルに入っているデータの垂直方向（上下）のアライメントに使われます。
一つのTable Rowに入っている全てのセルのテキストのVALIGNはTRにVALIGNアトリビュートを入れて指定できますが、各セルごとにテキストのVALIGNを変えたい場合にはTDにVALIGNを入れてコントロールすることが出来ます。
TDにVALIGNを入れた場合はTRに入ったVALIGNのヴァリューは無効になります。
VALIGNのヴァリュー(Value)は、TOP, MIDDLE, BOTTOMの三つです。ディフォルト(Default)はMIDDLEです。

Example:

<TABLE BORDER=2>
  <TR>
     <TD VALIGN=TOP>aaa</TD> <TD>bbb<BR>bbb</TD> <TD>ccc<BR>ccc<BR>ccc</TD>
  </TR>
  <TR>
     <TD>ddddd<BR>dddd<BR>dddd</TD> <TD>eeeee<BR>eeee</TD> <TD>fffff</TD>
  </TR>
</TABLE>

VALIGNの例

aaa	bbb bbb	ccc ccc ccc
ddddd ddddd ddddd	eeeee eeeee	fffff

WIDTH

このアトリビュートはセルの幅を指定する際に使われますが、同じColumn（縦列）にある他のセルが必要なサイズ（幅）よりも小さい場合は無視されます。単位はピクセル(pixel)です。

HEIGHT

セルの高さを指定する際に使われますが、同じRow（横列）にある他のセルが必要なサイズ（高さ）よりも小さい場合は無視されます。単位はピクセル(pixel)です。

このHEIGHTとWIDTHを使った場合はTABLEタグに入れたCELLPADDINGアトリビュートは無効になります。

Exampleでは分かりやすくするためにTABLEにBORDERアトリビュートを入れて枠を付けてあります。

• TDのChildエレメントにはTABLEも含まれています。つまり、この中でTABLEエレメントをネストすることも出来ます。ネストすることでより複雑なテーブルを作成することが出来ます。
  その場合は特に、オプションになっているTRタグとTDタグのクローズ・タグを省略せずに書き入れるようにして下さい。省略するとブラウザーによっては正確に表示出来ない場合があります。
• セルにイメージを入れる場合はIMGタグにイメージ・サイズを記入した方が良いでしょう。イメージサイズがない場合はイメージのロードが終わるまでセル・サイズが決まらないため、テーブルの表示が遅れることになります。
• テーブルに枠を付けた場合、データの入らないセルの表示は枠が無く、奇妙なものになると思います。その場合は、   をセルに入れて下さい。そのセルは空白のまま枠を表示してくれます。

基本的なテーブルの作り方はTABLEエレメントを読んで下さい。

Copyright (C) 1997 ABACUSS LTD.
www.abacuss.com