超初心者を脱皮したい-1
   表の使いこなしは難しいかな。


『答え』 簡単です。 既に覚えた額縁の文法をちょい変えるだけ。

額縁のHTMLは覚えてますか? こうでしたね。

<table border=8><TD>
<TABLE BORDER=1><TD>
<TABLE BORDER=2><td>
<img src="abc.gif"><br>
</td></TABLE>
</TD></TABLE>
</td></table>

表を書くときは、こんなHTMLになります。

<table border=1>
<TR><TD> 名 前 </TD><TD>ミスターOZ</TD>
<TR><TD> 住 所 </TD><TD>東京都中央区銀座1-2-3</TD>
<TR><TD> 電 話 </TD><TD>03-1234-5678</TD>
<TR><TD> メール </TD><TD>info@misteroz.net</TD>
</table>

それがブラウザ上では、↓のように見事な表作成に出来上がり。
 名 前 ミスターOZ
 住 所 東京都中央区銀座1-2-3
 電 話 03-1234-5678
 メール info@misteroz.net

どうです、わかりましたか。ここまで理解されたらこの項は修了。
既に中間制作で完成したHTMLに、リンクボタンと表 を加えようか。

<HTML><BODY bgcolor="#ccffcc"><center>
ようこそ、いらっしゃいませ。<br>
<TABLE BORDER=4><TD><TABLE BORDER=1><TD>
<font size=6><font color="#cc0000">
○○○’s  HOME PAGE
</font></font></TD></TABLE></TD></TABLE>
<br><font color="#0000ff">
<i>私の部屋の窓からの眺めをプレゼント!</i>
</font><br>
<TABLE BORDER=8><TD><TABLE BORDER=1><TD>
<TABLE BORDER=2><TD><img src="abc.gif">
</TD></TABLE></TD></TABLE></TD></TABLE>
<table border=1>
<TR><TD> 名 前 </TD><TD>ミスターOZ</TD>
<TR><TD> 住 所 </TD><TD>東京都中央区銀座</TD>
<TR><TD> 電 話 </TD><TD>03-1234-5678</TD>
<TR><TD> メール </TD>
<TD><A HREF="mailto:info@misteroz.net">
ココをクリックして</A></TD></table><p><br>
<font size=3><font color="#000000">
初めてのホームページ制作にチャレンジ中です。
<br></font></font></center></BODY></HTML>

表の中の「クリックして」のところにMAILTOを仕掛けた訳です。

おまけで画像と表の横並びサンプルも作っておきましたので興味があれば  ココ をクリックして下さい。
以上であなたも表作成はラクラクと確信します。

☆彡main point
 TABLE BORDERを宣言したら、あとは入れ子にTRとTDを書くだけ。
 文字だけでなく、画像でもリンクボタンでも表に入れられます。
 表の大きさは文字(画像)の大きさに適応してくれる親切さ。

 ・いろんな表にチャレンジして下さい。
 ・TABLE BORDERの後ろにいろんな指定を入れられます。
 ・表の線の太さ変更は額縁のBORDER=を参考にしてネ。


質問メール  OZ道場メニュー