FujiMan Production - ウェブマスター -
ホームページ制作講座 for Windows
テーブル(2)
トップページウェブマスターホームページ制作講座>テーブル(2)

戻る 次へ
■ブラウザの中のブラウザ


 説明を後回しにしたデータ要素は面白い仕組みになっています。 「sample16.html」のデータ要素に「sample15.html」の<BODY>〜</BODY>の内容(「sample17.html」の青の部分)に書き換えてみましょう。

sample17.html
<HTML>
<BODY>
<TABLE BORDER=1>
<TR>
<TD>
<IMG SRC="chara2.gif" ALIGN=TOP>
<FONT COLOR=CHOCOLATE SIZE=6>
<B><I>FujiMan Production</I>のホームページ</B><BR><BR>
</FONT>
<B>お気に入りサイト・ベスト3</B><BR><BR>
<DL>
<DT><A HREF="https://homepage1.nifty.com/anannoken/">俳優・阿南健治ホームページ</A>
<DD>https://homepage1.nifty.com/anannoken/
<DT><A HREF="https://FujiMan.net">FujiMan Production</A>
<DD>https://FujiMan.net
<DT><A HREF="https://www.chugokuh.rofuku.go.jp/">中国労災病院</A>
<DD>https://www.chugokuh.rofuku.go.jp/
</DL>

</TD>
</TR>
</TABLE>
</BODY>
</HTML>

 どうですか。あたかもデータ要素が小さなブラウザのようになりましたね。
 背景色はどうでしょうか。<BODY>タグの「BGCOLOR」オプションが<TD>にも用意されていますよ。

sample17-1.html
<HTML>
<BODY>
<TABLE BORDER=1>
<TR>
<TD BGCOLOR=lightpink>
<IMG SRC="chara2.gif" ALIGN=TOP>
<FONT COLOR=CHOCOLATE SIZE=6>
<B><I>FujiMan Production</I>のホームページ</B><BR><BR>
</FONT>
<B>お気に入りサイト・ベスト3</B><BR><BR>
<DL>
<DT><A HREF="https://homepage1.nifty.com/anannoken/">俳優・阿南健治ホームページ</A>
<DD>https://homepage1.nifty.com/anannoken/
<DT><A HREF="https://FujiMan.net">FujiMan Production</A>
<DD>https://FujiMan.net
<DT><A HREF="https://www.chugokuh.rofuku.go.jp/">中国労災病院</A>
<DD>https://www.chugokuh.rofuku.go.jp/
</DL>

</TD>
</TR>
</TABLE>
</BODY>
</HTML>

 背景画像(壁紙)はどうでしょうか。<TD>にも「BACKGROUND」オプションが用意されていますよ。

sample17-2.html
<HTML>
<BODY>
<TABLE BORDER=1>
<TR>
<TD BGCOLOR=lightpink BACKGROUND="lightpnk.gif">
<IMG SRC="chara2.gif" ALIGN=TOP>
<FONT COLOR=CHOCOLATE SIZE=6>
<B><I>FujiMan Production</I>のホームページ</B><BR><BR>
</FONT>
<B>お気に入りサイト・ベスト3</B><BR><BR>
<DL>
<DT><A HREF="https://homepage1.nifty.com/anannoken/">俳優・阿南健治ホームページ</A>
<DD>https://homepage1.nifty.com/anannoken/
<DT><A HREF="https://FujiMan.net">FujiMan Production</A>
<DD>https://FujiMan.net
<DT><A HREF="https://www.chugokuh.rofuku.go.jp/">中国労災病院</A>
<DD>https://www.chugokuh.rofuku.go.jp/
</DL>

</TD>
</TR>
</TABLE>
</BODY>
</HTML>

 このようにテーブルのデータ要素にはHTMLの構文がそのまま使えます。もちろんデータ要素の中に、さらにテーブルを指定することもできます。

 この性質を利用して、ページを細かくレイアウトすることができるようになりますが、その分、HTML構文は複雑に分かりにくくなります。

 最近では「スタイルシート」を用いて、構文が複雑になることを避けるようになっていますが、これも新しい技法を覚えなければならず、 私のような忙しい(^^;人間やビギナーにとっては飛び越えなければならない垣根になっていることに違いはないと思いますね。(^^ゞ



戻る 次へ

<-RETURN Copyright(c) 2001 FujiMan Production All Rights Reserved