中級第２章 ：テーブル（表）設定

	ここではタイトルの通り「テーブル（表）」について学んでいきます。 ただ単にＨＰを作るだけなら、テーブルをわざわざ使わなくても出来ます。 ならなぜテーブル機能があるのか？ テーブルには「画面構成を整理整頓出来る」または「見やすくレイアウト出来る」という大きな利点があります。 ここで学ぶテーブル設定をマスターすることで、画像や文字などを自由自在にしかもキレイにレイアウト出来るようになります。 テーブル設定には＜TABLE〜＞タグを使用します。 今までのように単純に…とはいかないですが、順を追って落ち着いて少しずつ学んでいきましょう！
例１：＜TABLE border="3"＞
	まずは「テーブル全体」の設定から始めます。 赤字の部分を見て下さい。 前章でも学んだように、「border="3"」とは線の太さですね。 つまり「３」の太さのラインがテーブル全体を包みます。 「３」のサイズには上限はありません。 任意の太さを設定してみて下さい。 ラインを消したい場合には「３」を「０」にします。
例２：＜TABLE border="3" align="center"＞
	赤字の部分が増えています。 前章でも学んだように、「center」の記述でテーブル全体を画面の真ん中に設定しました。 テーブル全体を画面左寄りにしたい時は「align="left"」、右寄りにしたい時は「align="right"」です。
例３：＜TABLE border="3" align="center" width="300"＞
	赤字の部分が更に増えています。 「width」（ウィドス）とは、ここではテーブル全体の横幅を表しています。 縦幅を指定する場合は「width」の後に「hight」（ハイト）を追記して下さい。 「３００」の値はテーブルの横幅を表すサイズ指定です。 この記述には、２タイプあります。 「300」のようにそのままの値で設定する方法と、「80％」とパーセンテージで設定する方法の２種類です。 最初はそのままの数字で設定するよりも、パーセンテージの方が使い易いかもしれません。 各自、いろいろ変えて変化を実感してみて下さい。
例４：＜TABLE border="3" align="center" width="300" cellspacing="3"＞
	赤字の部分が更に増えます。 「cellspacing」とはテーブル全体の枠からそれぞれのセルまでの余白部分を表しています。 この例では「３」に設定しましたので、全体枠からセルまでの余白はサイズ３になります。 やはりこの指定も値に上限はありません。 余白を無くしたい場合には「０」にします。 この指定を入力しなければ無条件にデフォルト値に設定されますので、必ずしも設定しなければならない訳ではありません。
例５：＜TABLE border="3" align="center" width="300" cellspacing="3" cellpadding="3"＞
	さて次の赤字部分に移ります。 なんだか↑の指定と似ていますね。 この指定は「セル内の枠から画像もしくは文字までの余白」を表しています。 この例では「３」としましたが、この値にも上限はありません。 同じように余白を無くしたい場合には「０」とします。 この指定も設定しなければデフォルト値となりますので、必ずしも設定する必要がある訳ではありません。
	ここまでが「テーブル全体の設定」です。 これまでにあげた例「ボーダー指定」「エリアをセンターに」「横幅サイズの指定」などには、基本的には順番は決まっていません。 必ずしも↑の順番で記述しなければいけない訳ではありませんので、各自見やすい順番を見つけて下さい。 がしかし、これだけでは中身がまだ何もありません。 周りの枠だけ、つまり中身の無い箱だけ状態です。 次に「中身の構成」に移りましょう！

	「中身の構成」は少しだけややこしくなります。 それは今までのように「１個のタグ」だけで出来る訳ではないからです。 手始めに、ここで使用する新たなタグの一覧を紹介しましょう。
＜TR＞＜/TR＞：セル１行につき、毎回使用します。 ＜TD＞＜/TD＞：セル１個１個の指定に使います。 ＜TH＞＜/TH＞：見出し指定に使います。
	上記のタグが新たに追加されます。 これらのタグを使用することによって、デザインがさまざまに変化します。 これから後は「サンプルページ」で解説します。
サンプルページへＧＯ！

テーブルの主な説明は以上です。 あとは組み合わせや応用で、さまざまなデザインが完成します。 数字部分やテーブルの組み方をいろいろ試してみて下さい！