7.■テーブルを配置
次は、テーブルを配置します。 基本的に、テーブルタグはコードが長くなってしまうので できるだけ <div> タグを使いたいところですが、 凝った配置にしたい場合に一番便利なのが、テーブルです。
<html>
<head></head>
<title>ここにページのタイトルを入れます</title>
<body bgcolor="white">
<div align="center">
<table border>
<tr>
<td>
1
</td>
</tr>
</table>
</div>
</body>
</html>
表示結果<head></head>
<title>ここにページのタイトルを入れます</title>
<body bgcolor="white">
<div align="center">
<table border>
<tr>
<td>
1
</td>
</tr>
</table>
</div>
</body>
</html>
さあ、そろそろ訳がわからなくなってきました。
ここでは、一つの枠の中に｢1｣という文字を入れただけです。
<tr>とは、横の並びのことです。
覚え方→("トラ"が横になって寝ている)
<td>とは、その横の並びの中に入っている箱のことです。
覚え方→(物が入る"戸だ"！)
わかりやすく図解してみました。
*文字や画像は<td></td>の中に直接入ります。
 |
<table border> <tr> <td>1</td> </tr> </table> |
*横3列にしたい場合、<td></td>を3つ作ります。
 |
<table border> <tr> <td>1</td><td>2</td><td>3</td> </tr> </table> |
*縦2列にしたい場合、<tr></tr>を2つ作ります。
 |
<table border> <tr> <td>1</td><td>2</td><td>3</td> </tr> <tr> <td>4</td><td>5</td><td>6</td> </tr> </table> |
私もこの仕組みが頭に入るまでずいぶん苦労しました。
やはり図解に限る！
