ばらばらになっている絵を組み立てるには<TABLE><TR><TD>タグを使います。

例えば、右のような画像。実際にはこんなものはないですが分かりやすくする為にこれを使います。
いろいろな事情で、このような画像が分割されてしまう事もよくある事です。
今回は、右の画像を９個に分割された場合の例を書きたいと思います。

単純にテーブルを使うと、こんな感じになってしまいます。
画像と画像の間に隙間が空いてしまっていて、しっくり行きません。

記述方法

表示イメージ

<TABLE> <TR> <TD><IMG SRC="img/lesson09-a.jpg"></TD> <TD><IMG SRC="img/lesson09-b.jpg"></TD> <TD><IMG SRC="img/lesson09-c.jpg"></TD> </TR> <TR> <TD><IMG SRC="img/lesson09-d.jpg"></TD> <TD><IMG SRC="img/lesson09-e.jpg"></TD> <TD><IMG SRC="img/lesson09-f.jpg"></TD> </TR> <TR> <TD><IMG SRC="img/lesson09-g.jpg"></TD> <TD><IMG SRC="img/lesson09-h.jpg"></TD> <TD><IMG SRC="img/lesson09-i.jpg"></TD> </TR> </TABLE>

こういった時に指定するパラメータがTABLEタグにはちゃんと用意されています。
それは、BORDER (線の幅)、CELLPADDING (セルの端からの余白)、CELLSPACING (セルとセルの間隔)の3つです。
これらをすべて0で指定してあげる事により、隙間が空いてしまっていたものをくっつける事が出来ます。

記述方法

表示イメージ

<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0> <TR> <TD><IMG SRC="img/lesson09-a.jpg"></TD> <TD><IMG SRC="img/lesson09-b.jpg"></TD> <TD><IMG SRC="img/lesson09-c.jpg"></TD> </TR> <TR> <TD><IMG SRC="img/lesson09-d.jpg"></TD> <TD><IMG SRC="img/lesson09-e.jpg"></TD> <TD><IMG SRC="img/lesson09-f.jpg"></TD> </TR> <TR> <TD><IMG SRC="img/lesson09-g.jpg"></TD> <TD><IMG SRC="img/lesson09-h.jpg"></TD> <TD><IMG SRC="img/lesson09-i.jpg"></TD> </TR> </TABLE>