その４
その４ではその３で言ったとおりテーブルタグについて話します。

テーブル・・・＜TABLE＞〜＜/TABLE＞

よくＨＰで文字が枠の中に表示されたりしてますよね。このタグを使えばそれができます。先に説明をします。

＜TABLE BORDER="a"＞
＜TR＞
＜TH＞〜＜/TH＞
＜TD＞〜＜/TD＞
＜/TR＞
＜/TABLE＞

＜table＞〜＜/table＞

このタグだけではテーブルは作れません。このタグの間にTRやTHなどをいれてひとつのテーブルにします。

＜TR＞〜＜/TR＞

このタグはテーブルの中の一段を表しています。テーブルのマス目を横につなげる場合はこのタグの中に＜TH＞〜＜/TH＞や＜TD＞〜＜/TD＞を入れていきます。

＜TH＞〜＜/TH＞、＜TD＞〜＜/TD＞

このタグはの間に書きたい文章を入れます。THとTDの違いはTHの 中に文字を入れると入れた文字は真ん中に表示され少し太くなります。TDの中に入れると入れた文字は左寄りになります。そうゆうのを考えて使い分けます。

BORDER="a"

このタグはTABLEタグの中にいれて効果がでます。どんな効果があるかとゆうとこのタグを使うと枠の太さが決められます。このタグをいれないと枠は現れません。これのaの中には０以上の数字を入れます。いろいろ入れてみて一番合う太さにしてください。

これだけ知っていれば一応基本のテーブルはできます。それでは例をやってみます。

例：＜TABLE BORDER="5"bgcolor="ffffff"＞

＜TR＞
＜TH＞真ん中＜/TH＞
＜TD＞左寄り＜/TD＞
＜/TR＞
＜/TABLE＞
これで

真ん中左寄り
こうなります。でもこれだとTHとTDの違いがわかりませんよね。違いをわかるようにするには横幅を大きくすればいい。次のタグでテーブルの幅を変えることができます。

WIDTH="b"、HEIGHT="b"

このタグはTABLEの中でもTH、TDの中でもどっちでも効果があります。bの中に数字または％を入れればWIDTHは横幅、HEIGHTは縦幅の大きさを変えれます。しかし縦幅のほうはＤＣには反映されません。ＰＣでみれば変わっているのがわかります。

例：＜TABLE BORDER="5"WIDTH="300"＞
＜TR＞
＜TH＞真ん中＜/TH＞
＜TD＞左寄り＜/TD＞
＜/TR＞
＜/TABLE＞
これで

真ん中左寄り
こうなります。これでTHとTDの違いがわかったよね。次はこのほかのテーブルの加工について教えます。

BGCOLOR="#RRGGBB"

これもTABLE、TH、TDに使えます。これを使えば使ったところのマスの色が変わります。RRGGBBの使い方はもうわかってると思うのでいいません。

COLSPAN="c"、ROWSPAN="c"
これはTH、TDにしか使えません。これを使うと枠組みをつなぐことができます。COLSPANは横につなげられてROWSPANは縦につなげられます。cの部分にはまたぐ枠の数を入れます。

CELLSPACING="d"

これはTABLEにしか使えません。これを使うとテーブルの内枠の太さを変えることができます。dの部分には０以上の数字を入れます。

CELLPADDING="e"

これもTABLEにしか使えません。これを使うと枠と中に書いた文字との間隔を開けることができます。

それではいままで紹介してきたテーブルタグ例を見せます。

例：＜TABLE BORDER="5"CELLSPACING="5"CELLPADDIMG="5"BGCOLOR="#FFFFFF"＞
＜TR＞
＜TH COLSPAN="3"＞自己紹介＜/TH＞
＜/TR＞
＜TR＞
＜TH＞名前＜/TH＞
＜TD COLSPAN="2"＞ゆう＜/TD＞
＜/TR＞
＜TR＞
＜TH＞年齢＜/TH＞
＜TD COLSPAN="2"＞１６歳＜/TD＞
＜/TR＞
＜TR＞
＜TH＞誕生日＜/TH＞
＜TD COLSPAN="2"＞１１月８日＜/TD＞
＜/TR＞
＜TR＞
＜TH ROWSPAN="2"＞趣味＜/TH＞
＜TD＞ゲーム＜/TD＞
＜TD＞ＲＰＧが一番好き。＜/TD＞
＜/TR＞
＜TR＞
＜TD＞音楽＜/TD＞
＜TD＞ヒッキー最高！＜/TD＞
＜/TR＞
＜/TABLE＞
少し長いけどこれで

自己紹介
名前ゆう
年齢１６歳
誕生日１１月４日
趣味ゲームＲＰＧが一番好き。
音楽ヒッキー最高！
こんな感じの簡単な自己紹介ができます。

テーブルは工夫すれば色々できるのでいろんなことをためしてみてはどうでしょう？それじゃこのへんでその４終わります。その５はやるかわかりません。話すことがないから・・・

戻る

このページは GeoCitiesです 無料ホームページをどうぞ