テーブルのページ



テーブルの基本

テーブルのタグ

1. もっともシンプルなテーブル

  1. <table>〜</table>でテーブルの外枠部分を記述
  2. <tr>〜</tr>で行を指定
  3. 行の中の<td>〜</td>に打ったものがセル内に表示される
  4. border="1"で分かりやすくするためにテーブルの骨格を表示
table
テーブルの外枠
tr
テーブルの行(table row
td
テーブルのセル
1

2.テーブルの列を増やす

<tr>〜</tr>のなかにいくつ<td>〜</td>があるかで列の数が決まる
123

テーブルの行を増やす

<table>〜</table>のなかにいくつ<tr>〜</tr>があるかで行数が決まる
123
456
一行目と二行目で列数が違う矛盾を避けるため、行ごとコピーしてtd内を打ち返る

4.テーブルの幅の変化

1112223333
456
テーブル、各セルの大きさは中身にあわせて自動で伸縮する

カレンダー

 123456
78910111213
14151617181920
21222324252627
282930    
<td>〜</td>の中が空だとセルはへコマない
代わりに全角スペースを入れることで凹ませている

テーブルの復習

123
456

12月のカレンダー

   1234
567891011
12131415161718
19202122232425
262728293031 

5.テーブルのサイズ指定(相対指定)

111222333
456

6.テーブルのサイズ指定(絶対指定)

111222333
456

7.セルのサイズ指定

111222333
456

8.bgcolor

111222333
456

9.テーブルノアライン

111222333
456

10.セルの余白

111222333
456
4とテーブルの端に注目

11.セルとセルの間隔

111222333
456
cellspacing="10"の場合
111222333
456
cellspacing="0" border="0"にするとセル同士がくっつく

12.列の結合

111222333
456
いらなくなった<td>〜</td>は自分で削除

13.行の結合

111222333
56