表の作成
テーブル(表)を作成します。
表の基本タグ 行と列の指定
枠線の指定




表の基本タグ
<TABLE>〜</TABLE>枠線無し
<TABLE BORDER>〜</TABLE>枠線有り

 テーブル(表)を作成するタグの基本要素です。 このタグの中に<TR>(セルの作成)や<TD>(列の定義)等のタグを入れます。
 BORDERオプションは枠線を設定するものです。 枠線が無くても表は作成されますが、本来枠線が表示されるべきスペースを空けて表示されます。 そのため、<TABLE>と<TABLE BORDER>の各項目の表示される位置は変わりません。
 また、テーブルの中にはテキストやイメージなどを入れるほか、 テーブル自体を入れ子にすることもできます。
  テーブルを使用すれば、殆ど自分の思いどおりのレイアウトにすることは可能です。 しかし、テーブル内に入ったイメージなどを全て読み込んでから表示されるので、 大きなテーブルは表示速度が遅くなるので注意が必要です。

簡単♪表の作成(Table)

Topへ


行と列の指定
<TR>〜</TR>横1行の定義
<TD>〜</TD>セル1個の定義
<TH>〜</TH>小見出しセル1個の定義

 <TR>〜</TR>は、テーブルの横1行分を表します。 繰り返し記述することで、その数だけの行数を増すことが出来ます。 また、<TR>タグだけ単独で改行タグのように使用することも可能です。
 <TR>〜</TR>の中に、<TD>〜</TD>または、 <TH>〜</TH>で囲まれたセルが入ります。 セルを増やすには、それらを繰り返し記述します。
 <TH>〜</TH>は、見出し(ヘッダ)を付けたいときに、 <TD>〜</TD>の変わりに使用します。 この中に挟まれたテキストは、太字になり、セルの中でセンタリングされます。
 ※空のセルがあるテーブルはブラウザに表示される際、 セルがつぶれてしまい罫線がきれいに表示されません。 この場合、<BR>タグを入れると、きれいな罫線が表示されるようになります。

<BR>について

Topへ


枠線の指定
<TABLE オプション>〜</TABLE>
オプション BORDER="n":
CELLSPACING="n":

CELLSPADDING="n":

外枠の太さを指定します。
セルの全ての枠線の太さを指定します。
(デフォルトは2)
枠線と表中のテキストとのスペースを指定します。
(デフォルトは1)
n = ピクセル数

 <TABLE>タグにオプションを付け、 表の枠線の太さや表中のテキストとの間隔を指定します。
 BORDERオプションは枠線の太さの指定をしています。 デフォルトは"1"なので<TABLE BORDER>〜</TABLE>と表示は同じです。 "0"に指定した場合は、<TABLE E>と同じ表示になります。

Topへ

見本SOURCE

<HTML>
<HEAD>
<TITLE>表の作成</TITLE>
</HEAD>
<BODY BGCOLOR="#FFFFFF">
<TABLE>
<TR><TD>枠のない表です</TD>
<TD>こう見えても立派な表なんですよ</TD></TR>
</TABLE><BR>
<TABLE BORDER>
<TR><TH>枠付きの表です</TH>
<TD><BR></TD></TR>
<TR><TH></TH>
<TD>いかがなものでしょうか?</TD></TR>
</TABLE><BR>
 BRが入っているセルとそうでないはセルとの違いを比べてみて下さい。
</BODY>
</HTML>


このSOURCEを実行してみる...
10秒で自動クローズします。



Topへ


前のページへ 次のページへ