とうとう、テーブルタグについて学ぶ時がやってきました。これは、とっても応用度の高いタグです。
本来の、表組みという使い方だけではなく、ホームページのレイアウトを決めたりするにも大変便利のいいタグなのです。
でも難しいです。● それでは、始めましょう！
いつものように、メモ帳で次のように入力して下さい。
<html>
<body><table border="1"><tr><td>
すずきたつゆき
</td></tr></table>
</body>
</html>
結果は次のようになります。
すずきたつゆき このように、テーブルタグを使うことで、オブジェクトを囲ったり、表組みを作ることができるのです。
今、記述した書き方が、最も基本的な最小限の記述方法ですが、もっと複雑になって来ると、これでは解り難いので、次のようにタグを並べ替えて記述すると、見やすくなります。
でも段落を付ける時は、半角のスペースでなくてはなりません。
<html>
<body><table border="1">
<tr>
<td>すずきたつゆき
</td>
</tr>
</table></body>
</html>
それでは、２限目でタグの解読をすることにしましょう。
キーンコーンカーンコーン・・・（１限目終了）
２限目 （テーブルタグについて）
では、じっくりとテーブルタグについて理解していきましょう！！
今度は、次のように記述してみて下さい。
<html>
<body><table border="1">
<tr>
<td>すずき</td><td>たつゆき</td>
</tr>
</table></body>
</html>
次のようになりましたか？
すずき たつゆき このように、一番内側のタグ <td> と </td> で挟んだオブジェクトは、表組みが、横へ横へと作られていきます。
上の例では「すずき」と「たつゆき」の２つだけですが、さらに、 <td> と </td> で挟んだオブジェクトを追加すると、どんどん横へ作られていきます。
試しにやってみて下さい！では次に、表組みを縦に作る場合はどうしたら、いいでしょうか？
それではまた、次のように記述して下さい。
<html>
<body><table border="1">
<tr>
<td>すずき</td>
</tr><tr>
<td>たつゆき</td>
</tr></table>
</body>
</html>
次のようになりましたか？
すずき たつゆき <td> と </td> で挟まれたオブジェクトが、さらに <tr> と </tr> というタグで挟まれているのが、よ〜く見ると解ると思います。
そうです、表組みを縦に作るには、<td> と </td> で挟まれたオブジェクトをさらに、<tr> と </tr> で挟むことで、表組みの縦ができるのです。これらを組み合わせて、次のように記述すると・・・
<html>
<body><table border="1">
<tr>
<td>すずき</td> <td>たつゆき</td>
</tr><tr>
<td>鈴木</td> <td>辰之</td>
</tr></table>
</body>
</html>
結果は次のようになりましたね。
すずき たつゆき 鈴木 辰之 まずはこの、<td> と <tr> の使い分けをしっかり理解して、横や、縦に自由に桝目を作れるようになって下さい。
次回は、これらテーブルタグの応用に入ります。今日の講座内容を理解できれば、そんなに難しくありません（多分）！！テーブルタグを使いこなせるようになると、ブラウザーの種類が変わっても、或いは、画面解像度が変わっても、レイアウトの壊れない表示方法などができたりして、これはとっても便利の言いタグです！！
みなさん是非マスターしましょう。しばらく、この講座はテーブルタグの醍醐味にはまりそうです・・・
ということで、こうはここまでです！！