超入門ホームページタグの勉強テーブルタグを勉強しよう。

ホームページ作成超入門講座テーブルタグを作って見よう

作るのは最後にして、とりあえずテーブルタグを見てみましょう。
表枠の勉強ですが、ホームページ編集ソフトを使うようになれば
あまりTABELタグを書くことも無いと思いますので、余り深く考えず見てください。
開始タグと終了タグの意味だけ理解すれば良いと思います。

テーブルタグって何？

表です。
ホームページでよく目にする表をテーブルと言います。
下図参照

でわテーブルタグを見てみましょう。

<HTML>
<HEAD>

<TITLE>
あかかげまるのホームページ講座
</TITLE>

</HEAD>

<BODY>

あかかげまるのページへようこそ<BR>
ホームページ本文を改行する練習です。
<TABLE BODER="2">
<TR>
<TD>
これがテーブル（表）です
</TD>
</TR>
</TABLE>

</BODY>
</HTML>

紫色の部分がテーブルタグです。
<TABLE><TR><TD>が開始タグ

</TD></TR></TABLE>が終了タグ
開始タグと終了タグの間に文章や画像を入れることが出来ます。

※BODER="2"と言うものが<TABLE>の中に有ります。
これは表の枠の太さを指定するものです。BODER=""の指定がなければ
枠無しの表になります。

表枠指定　BODERの説明

BODRE="数字"
任意の数字を入れると表の枠の太さが変わります。
下参照
※ <TABLE BODER="数字">のところだけを見てください。

<HTML>
<HEAD>

<TITLE>
あかかげまるのホームページ講座
</TITLE>

</HEAD>

<BODY>

あかかげまるのページへようこそ<BR>
ホームページ本文を改行する練習です。
<TABLE BODER="5">
<TR>
<TD>
これがテーブル（表）です
</TD>
</TR>
</TABLE>

</BODY>
</HTML>

今度はBODER="5"と指定して見ます。
下図参照。

表枠指定　BODERのサンプル

※ <TABLE BODER="数字">のところだけを見てください。

<HTML>
<HEAD>

<TITLE>
あかかげまるのホームページ講座
</TITLE>

</HEAD>

<BODY>

あかかげまるのページへようこそ<BR>
ホームページ本文を改行する練習です。
<TABLE BODER="0">
<TR>
<TD>
これがテーブル（表）です
</TD>
</TR>
</TABLE>

</BODY>
</HTML>

<HTML>
<HEAD>

<TITLE>
あかかげまるのホームページ講座
</TITLE>

</HEAD>

<BODY>

あかかげまるのページへようこそ<BR>
ホームページ本文を改行する練習です。
<TABLE BODER="1">
<TR>
<TD>
これがテーブル（表）です
</TD>
</TR>
</TABLE>

</BODY>
</HTML>

<HTML>
<HEAD>

<TITLE>
あかかげまるのホームページ講座
</TITLE>

</HEAD>

<BODY>

あかかげまるのページへようこそ<BR>
ホームページ本文を改行する練習です。
<TABLE BODER="10">
<TR>
<TD>
これがテーブル（表）です
</TD>
</TR>
</TABLE>

</BODY>
</HTML>

次に表枠を増やすタグの勉強です。(列を増やす方法)

表枠を増やす勉強で、ホームページ編集ソフトを使うようになれば
まずは列を増やす方法
開始タグと終了タグ、また開始タグ～となって最後にTABLEの終了タグとなります。
♪♪♪♪表タグの開始タグと終了タグ♪♪♪♪
<TABLE>　表開始タグ　<TR>　表行の開始タグ　<TD>　表列の開始タグ　</TD> 表列の終了タグ　<TD> 表列の開始タグ　</TD>表列の終了タグ　</TR>　表行の終了タグ　</TABLE>表の終了タグとなります。
♪♪♪♪表タグの開始タグと終了タグ♪♪♪♪

※<TD></TD>を見てください。
<HTML>
<HEAD>

<TITLE>
あかかげまるのホームページ講座
</TITLE>

</HEAD>

<BODY>

あかかげまるのページへようこそ<BR>
ホームページ本文を改行する練習です。
<TABLE BODER="1">
<TR>
<TD>
これがテーブル（表）です
</TD>
<TD>
枠を増やして見ます
</TD>
<TD>
列が増えましたね
</TD>
<TD>
列の場合はこのように増えます
</TD>
</TR>
</TABLE>

</BODY>
</HTML>

表列タグの<TD></TD>の例。

※ <TD></TD>のところだけを見てください。

<HTML>
<HEAD>
<TITLE>
あかかげまるのぺーじ
</TITLE>
</HEAD>
<BODY>
あかかげまるのページへようこそ<BR>
ホームページ本文を改行する練習です。
<TABLE border="1">
<TR>
<TD>これがテーブル（表）です</TD>
<TD>まずこれで一列増えます</TD>
</TR></TABLE>
</BODY>
</HTML>

次に表枠を増やすタグの勉強です。(行を増やす方法)

表枠を増やす勉強で、ホームページ編集ソフトを使うようになれば
次は列を増やすタグの勉強です。
開始タグと終了タグ、また開始タグ～となって最後にTABLEの終了タグとなります。
♪♪♪♪表タグの開始タグと終了タグ♪♪♪♪
<TABLE>　表開始タグ　<TR>　表行の開始タグ　<TD>　表列の開始タグ　</TD> 表列の終了タグ　<TD> 表列の開始タグ　</TD>表列の終了タグ　</TR>　表行の終了タグ　</TABLE>表の終了タグとなります。
♪♪♪♪表タグの開始タグと終了タグ♪♪♪♪

※<TR><TD></TD></TR>を見てください。
<HTML>
<HEAD>

<TITLE>
あかかげまるのホームページ講座
</TITLE>

</HEAD>

<BODY>

あかかげまるのページへようこそ<BR>
ホームページ本文を改行する練習です。
<TABLE BODER="1">
<TR>
<TD>
これがテーブル（表）です
</TD>
</TR>

<TR>
<TD>
枠を増やして見ます
</TD>
</TR>

<TR>
<TD>
行が増えましたね
</TD>
</TR>

<TR>
<TD>
行の場合はこのように増えます
</TD>
</TR>
</TABLE>

</BODY>
</HTML>

表行タグ<TR><TD></TD></TR>の例

※<TR><TD></TD></TR>を見てください。

<HTML>
<HEAD>
<TITLE>
あかかげまるのぺーじ
</TITLE>
</HEAD>
<BODY>
あかかげまるのページへようこそ<BR>
ホームページ本文を改行する練習です。
<TABLE border="1">
<TR>
<TD>
これがテーブル（表）です
</TD>
</TR>
<TR>
<TD>
まずこれで一行増えます
</TD>
</TR>
</TABLE>
</BODY>
</HTML>

表タグの応用編

※<TD></TD>列の開始タグ終了タグ
※<TR><TD></TD></TR>行の開始タグと終了タグ
上記のタグを見れるようにれるように勉強しましょう。

<HTML>
<HEAD>
<TITLE>
あかかげまるのぺーじ
</TITLE>
</HEAD>
<BODY>
あかかげまるのページへようこそ<BR>
ホームページ本文を改行する練習です。
<TABLE border="1">
<TR>

<TD>
これがテーブル（表）
</TD>

<TD>
二列目
</TD>

</TR>

<TR>

<TD>
ニ行目
</TD>

<TD>
二行目の二列目
</TD>

</TR>

</TABLE>
</BODY>
</HTML>

いかがでしたでしょうか？
説明するのも難しいけど、初めての方にはちょっと
理解しがたいものがあると思います。

でも暇つぶしに三日程度練習すれば、基本タグなんてすぐ理解できます。
頑張ってホームページ作ってくださいね。

トップに戻る　前のページに戻る　ホームページ作成勉強部屋に戻る

スポンサードリンク

Subscribe in a reader