<table><tr><td>〜</td></tr></table>
表を作成します。
<table>で始まり</table>で終わります。その間に<tr><td>〜</td></tr>を入れます。
<tr>は行を区切り、<td>は列を区切ります。
テーブルタグはブラウザのウィンドウサイズに関係なくサイズを指定して使えるので、使いこなせるようになればページをきれいにレイアウトすることができます。
|
（例）
<table>
<tr>
<td>テーブル1</td><td>テーブル2</td>
</tr><tr>
<td>テーブル3</td><td>テーブル4</td>
</tr>
</table>
|
（2*2）
|
<table width=☆ height=☆><tr><td>〜</td></tr></table>
☆：ピクセル数か%
|
（例）
<table width=200 height=70><tr><td>
幅200 高さ70にします。
</td></tr></table>
|
 | サイズ指定−Microsoft Internet Explorer
|
|
ファイル（F） 編集（E）...
|
|
|
<table border=ピクセル数><tr><td>〜</td></tr></table>
外枠の太さを指定します。
|
（例）
<table border=10>
<tr>
<td>テーブル1</td><td>テーブル2</td>
</tr><tr>
<td>テーブル3</td><td>テーブル4</td>
</tr>
</table>
|
|
border=5
| |
|
border=0
|
|
<table bordercolor=カラー名か#RGB値 ><tr><td>〜</td></tr></table>
テーブルの枠線の色を指定します。
「bordercolorlight」と「bordercolordark」で枠線の色を2種類にすることが出来ます。
「bordercolorlight」は左と上の枠線の色、「bordercolordark」は右と下の枠線の色が指定できます。
|
（例）
<table border=5 bordercolor=#339900>
<tr>
<td>テーブル1</td><td>テーブル2</td>
</tr><tr>
<td>テーブル3</td><td>テーブル4</td>
</tr>
</table>
|
|
<table align=☆ ><tr><td>〜</td></tr></table>
☆：left,center,right
テーブルの表示位置を指定します。
|
（例）
<table align=☆><tr><td>
</td></tr></table>
|
|
<table cellspacing=ピクセル数><tr><td>〜</td></tr></table>
テーブルの外枠とセルの間隔を指定します。
|
（例）
<table border=1 cellspacing=10>
<tr>
<td>テーブル1</td><td>テーブル2</td>
</tr><tr>
<td>テーブル3</td><td>テーブル4</td>
</tr>
</table>
|
|
cellspacing=1
| |
|
cellspacing=0
|
|
<table cellpadding=ピクセル数><tr><td>〜</td></tr></table>
文字と枠の余白を指定します。
|
（例）
<table border=1 cellpadding=20>
<tr>
<td>テーブル1</td><td>テーブル2</td>
</tr><tr>
<td>テーブル3</td><td>テーブル4</td>
</tr>
</table>
|
|
cellpadding=5
| |
|
cellpadding=0
|
|
<table bgcolor=カラー名か#RGB値><tr><td>〜</td></tr></table>
テーブル全体の背景色を指定します。
|
（例）
<table border=1 bgcolor=#FF6699>
<tr>
<td>テーブル1</td><td>テーブル2</td>
</tr><tr>
<td>テーブル3</td><td>テーブル4</td>
</tr>
</table>
|
|
|
|
<table background=ファイル名><tr><td>〜</td></tr></table>
テーブル全体の背景を画像にします。
|
（例）
<table border=1 background=bg1.gif>
<tr>
<td>テーブル1</td><td>テーブル2</td>
</tr><tr>
<td>テーブル3</td><td>テーブル4</td>
</tr>
</table>
|
|
|
|
<tr><th>〜</th></tr>
<td>の代わりに<th>を使うことでそのセルが見出しになり、文字が強調されます。
|
（例）
<table border=1>
<tr>
<th>見出し1</th><th>見出し2</th>
</tr><tr>
<td>テーブル1</td><td>テーブル2</td>
</tr><tr>
<td>テーブル3</td><td>テーブル4</td>
</tr>
</table>
|
|
| 見出し1 | 見出し2 |
| テーブル1 | テーブル2 |
| テーブル3 | テーブル4 |
|
|
<td width=☆ height=☆>〜</td>
☆：ピクセル数か%
セルそれぞれのサイズを変えることが出来ます。
|
（例）
<table border=1>
<tr>
<td width=100 height=50>テーブル1</td>
<td>テーブル2</td>
</tr><tr>
<td>テーブル3</td><td>テーブル4</td>
</tr>
</table>
|
|
|
|
<td align=☆ valign=□>〜</td>
☆：left,center,right
□：top,middle,bottom
「align」は横の位置、「valign」は縦の位置を指定することが出来ます。
|
（例）
<table border=1>
<tr>
<td align=left valign=top>左上</td>
<td align=center valign=top>上</td>
<td align=right valign=top>右上</td>
</tr><tr>
<td align=left valign=middle>左</td>
<td align=center valign=middle>真ん中</td>
<td align=right valign=middle>右</td>
</tr><tr>
<td align=left valign=bottom>左下</td>
<td align=center valign=bottom>下</td>
<td align=right valign=bottom>右下</td>
</tr>
</table>
|
|
|
|
<td rowspan=セルの数>〜</td>
セルを縦方向につなげます。
|
（例）
<table border=1>
<tr>
<td rowspan=3>縦につなげる。</td>
<td>テーブル1</td>
</tr><tr>
<td>テーブル2</td>
</tr><tr>
<td>テーブル3</td>
</tr>
</table>
|
|
| 縦につなげる。 |
テーブル1 |
| テーブル2 |
| テーブル3 |
|
|
<td colspan=セルの数>〜</td>
セルを横方向につなげます。
|
（例）
<table border=1>
<tr>
<td colspan=3>横につなげる。</td>
</tr><tr>
<td>テーブル1</td>
<td>テーブル2</td>
<td>テーブル3</td>
</tr>
</table>
|
|
| 横につなげる。 |
| テーブル1 |
テーブル2 |
テーブル3 |
|
|
<td bgcolor=カラー名か#RGB値></td>
セルの背景に色をつけます。
|
（例）
<table border=1>
<tr>
<td bgcolor=#00FFFF>テーブル1</td>
<td bgcolor=#66FFFF>テーブル2</td>
</tr><tr>
<td bgcolor=#CCFFFF>テーブル3</td>
<td>テーブル4</td>
</tr>
</table>
|
|
|
|
<td background=ファイル名></td>
セルの背景に画像を使います。
|
（例）
<table border=1>
<tr>
<td background=bg2.gif>テーブル1</td>
<td>テーブル2</td>
</tr><tr>
<td>テーブル3</td>
<td background=bg3.gif>テーブル4</td>
</tr>
</table>
|
|
|
|
|
