1. マージンと枠の幅

見出し　1	見出し　2
内容，内容・・・	とほほ

というテーブルを書くには・・・

<table border=8 cellpadding=5 cellspacing=3>
<tr>
<th>見出し　1</th>
<th>見出し　2</th>
</tr>
<tr>
<td> 内容，内容・・・ </td>
<td>とほほ</td>
</tr>
</table>

th : * 見出し用セル，デフォルトでは中央寄せ・太字
td : データ用セル，デフォルトでは左寄せ
border : * 影の太さ，省略したとき影は普通表示されない．
cellpadding : * セル内のマージン，指定しないときはマージンが0
cellspacing : * 枠（セル間）の太さ
※ * 印のものは省略可．

2. 幅と高さも指定するとよい．省略可

中身，なかみ・・・

<table border=1 width=200 height=80>
<tr>
<td>中身・なかみ・・・</td>
</tr>
</table>

width : 幅．table , th , td に指定可． ピクセル，パーセント(tableのみ) で指定．
height : 高さ．table , th , td に指定可． ピクセル，パーセント(tableのみ) で指定．

正確な width , height の計算法
- cellspacing （枠の隙間）を記述した場合 -

『セルの幅 + 枠の隙間（両端とセル間）』

秋のくだもの		おいしさ
ぶどう	くり	とってもおいし
かき	もも
なし	りんご

<table border=1 cellspacing=0>
<tr>
<th colspan=2>秋のくだもの </th>
<th>おいしさ </th>
</tr>
<tr>
<td>ぶどう </td>
<td>くり </td>
<td rowspan=3>とってもおいし </td>
</tr>
<tr>
<td>かき </td>
<td>もも </td>
</tr>
<tr>
<td>なし </td>
<td>りんご </td>
</tr>
</table>

colspan : 横方向セルの連結．セルの数を指定．
rowspan : 縦方向セルの連結．セルの数を指定．

連結した場合，不要になる <td> </td> は 消しておかないと泣きそうになる．
セルの連結をするとき，作成中は border 属性を 1 以上にして枠を表示しておくと どこを直せばいいかが見つけやすくなる．

align ->	left	center	right
valign （下）
top	align=left(Default) valign=top	align=center valign=top	align=right valign=top
middle	align=left(Default) valign=middle(Default)	align=center valign=middle(Default)	align=right valign=middle(Default)
bottom	align=left(Default) valign=bottom	align=center valign=bottom	align=right valign=bottom

※ Default は，td のとき． th のデフォルトは，align=center , valign=middle．

<table border=1 cellspacing=0 width=400 height=300>
<th>align -></th>
<th rowspan=2>left</th>
<th rowspan=2>center</th>
<th rowspan=2>right</th>
</tr>
<tr>
<th>valign （下）</th>
</tr>
<tr>
<th>top</th>
<td align=left valign=top>align=left(Default)<br>valign=top </td>
<td align=center valign=top>align=center<br>valign=top </td>
<td align=right valign=top>align=right<br>valign=top </td>
</tr>
<tr>
<th>middle</th>
<td align=left valign=middle>align=left(Default)<br>valign=middle(Default) </td>
<td align=center valign=middle>align=center<br>valign=middle(Default) </td>
<td align=right valign=middle>align=right<br>valign=middle(Default) </td>
</tr>
<tr>
<th>bottom</th>
<td align=left valign=bottom>align=left(Default)<br>valign=bottom </td>
<td align=center valign=bottom>align=center<br>valign=bottom </td>
<td align=right valign=bottom>align=right<br>valign=bottom </td>
</tr><br>
</table>

※ 省略可
align : 横方向の位置．left(td でのデフォルト) , center(th でのデフォルト) , rightで指定．
valign : 縦方向の位置．top , middle(td , th でのデフォルト) , bottomで指定．

緑の背景	桃色の背景
背景指定なし	黄色の背景

<table border=1 cellspacing=1>
<tr>
<td bgcolor="#66FF66">緑の背景</td>
<td bgcolor="#FF99FF">桃色の背景</td>
</tr>
<tr>
<td>背景指定なし</td>
<td bgcolor="#FFFF00">黄色の背景</td>
</tr>
</table>

bgcolor : table , tr , td , th に指定可．省略可

tale に背景色を指定した場合，IE では cellspacing （枠の隙間）と border （外枠）の部分にも色がつく． NS は tr , td , th と同じようにセルの部分のみ．

色については [Web-color Sample] を参照．

天気予報は？

日	予報
ある日	晴れのち曇り
次の日	雨

という風にテーブルに題をつけたいときは， table タグの中（すぐ下）で，tr の前（外）に記述する．

<table border=1>
<caption>天気予報は？</caption>
<tr>
<th>日</th>
<th>予報</th>
</tr>
<tr>
<td>ある日</td>
<td>晴れのち曇り</td>
</tr>
<tr>
<td>次の日</td>
<td>雨</td>
</tr>
</table>