テーブルのページ
テーブルのページ
テーブルの基本
テーブルのタグ
<table>
テーブルの外枠
<tr>
テーブルの行
<td>
テーブルのセル(列)
table | テーブルの外枠 |
tr | テーブルの行(Table Row) |
td | テーブルのセル(列)(Table Date) |
1.もっともシンプルなテーブル
- <table>〜</table>でテーブルの外枠部分を記述
- <tr>〜</tr>で行を指定
- 行の中の<td>〜</td>内に打ったものがセル内に表示される
- テーブルの骨格をわかりやすくするためにborder="1"で表示させる
2.テーブルの列を増やす
<tr>〜</tr>内にいくつ<td></td>があるかで列の数が決まる
3.テーブルの行を増やす
<table>〜</table>内にいくつ<tr>〜</tr>があるかで行の数が決まる
1行目と2行目で列数が違う矛盾を避けるため、行ごとコピーしてtd内を打ちかえる
4.テーブルの幅の変化
各セルの大きさは中身に合わせて自動で伸縮する
カレンダー
月 | 火 | 水 | 木 | 金 | 土 | 日 |
| | | | 1 | 2 | 3 |
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | |
きょうのひとこと | テーブルはややこしい感じがしましたが、やってくると増やしたりしたのが楽しかったりするので良かったです。 |
セルの結合の復習
問題1
問題2