初心者でもタグやスタイルシートを学んで、思い通りのホームページが作成できる講座を、現在メールマガジンにて配信しています。当サイトを利用するに当たって、是非メールマガジンを購読することをお勧めします。なお、未だ購読されていない方はこちらから登録できます。念のため無料です。

今週のおさらいバックナンバーはこちらから
第１号  第２号  第３号  第４号  第５号  第６号  第７号  第８号  第９号  第10号
第11号  第12号  第13号  第14号  目次

プレーンテキスト版バックナンバー

今週＜第15号＞マガジンのおさらい

　　　　　　　　　　　　　　　　　  毎週金曜日配信　What's New 2002/8/23
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
　今週の課題■ テーブルの作成　その３

◆今回はテーブルによるレイアウトの表現を中心に講座を進めます。ある意味で
はテーブルを使うハイライトかもしれません。
　初心者にはちょっと難しいと思いますが、繰り返し何度もお読みください。
ポイントとして、どこまでが横の行で、どこまでがセルの範囲なのかをつかんで
おくことが大切です。

当サイトのトップページでも、テーブルを使ってレイアウトを構成しています。ボックスなどブロックレベル要素で記述したコンテンツを横に２つ並べるには、テーブルは不可欠です。テーブルをうまく使うことによって表現豊かなページに仕上げることが可能です。
下記のテーブルのサンプルをご覧下さい。セル内にリストや見出し要素を配置したテーブルです。

	Web for beginner	Element Propaty Value
HTML -- Hyper Text Markup Language CSS --- Cascading Style Sheet

Latest Update Aug,23,2002

HTML文はメールマガジン第15号を参照してください。

スタイルシートとの組み合わせによって、テーブルはどのような表現も可能にする応用の広い要素です。是が非でもテーブルはマスターしておきたいところです。

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
◆テーブルの中にテーブルを入れる
いわゆるテーブルの入れ子というもので、セルの中にテーブルを記述して入れ子
にします。慣れないうちはややこしくなってしまいますが、設計段階で整理して
おくと理解が早いと思います。
　ポイントとして、入れ子にするテーブルは、データセル（td）の中で記述する
ようにします。

下記のテーブルをご覧ください。テーブルの横の行は３つのセルから成り立っています。左と右側のセルの中に入れ子のテーブルを記述しています。

真ん中のセルには見出し要素と段落を表わす p要素を記述しています。この中に適当な画像を入れていただいてもかまいませんが、あまり大きなサイズの画像では不意な横スクロールが発生する可能性があります。

なお、コンテンツは適当に選んだものです。この中に画像やアンカーなどを入れるとトップページで使えそうなレイアウトになります。

テーブルに入れ子を入れたりすると複雑になって収拾がつかなくなる場合があります。初めはテーブルに枠線を表示してセルの範囲や行の並びなどを検証するようにすると理解しやすいと思います。なお、テーブルの枠線表示は、第13号をお読みください。

上記のHTML文は今週のマガジンをお読みください。また、上記のサンプルを少し改造した物を用意しました。参考になると幸いに思います。→　Sample