| 解 説 | HTML リスト＆ページ (タグの詳細) |
①二つ目の表には画像を並べるので枠線を消すため、border="0"としました。 ②行全体を中央配置するようにalign="center"で指定しました。 ③一列目のセルの高さを指定height="121"して、行全体の高さを指定します。 ④リンク設定された図を枠なしborder="0"とし、幅と高さwidth="139" height="106"を設定し、図が非表示のとき表示する文字alt="中国 九寨溝・黄龍"も指定しました。 ⑤図と同時に文字も、同じリンク先にクリッカブルにしました。 ⑥２行目以降も同じように記述します。 ⑦４列接続して、１行分のスペースを作りました。 ⑧３行目も一行目と同様に記述しました。 ⑨色付きで太めの水平線を追加しました。 ⑩リンク指定で、メール先指定でメールソフトが起動するようにmailtoを記述しました。 ⑪半角スペースを記述したいときは、 と記述します。 ⑫http から書いて、絶対アドレスを指定することも出来ます。 ⑬リンク先のページを新たなページに開くには、target="_blank"を記述します。 ⑭タグは入れ子を乱さないように注意して閉じましょう。 仕上り予定のページ |
<html> <head> ・・・・途中省略・・・・</head> <body background="st01_bg.gif"> <center><font ・・・・・・・・</font><br><br> <table border="0" bgcolor="#00cc00" ・・・・・・・・ ・・・・・・・・ ・・・・途中省略・・・・ ・・・・・・・・ </table> <br><br> (ここまでは前のページで解説) ①<table width="720" border="0"> <tr ②align="center"> <td width="25%" ③height="121"><a href="../../../jsisen/jkyusai/jkyusai.html"> <img src="taku44s.jpg" ④width="139" height="106" border="0" alt="中国 九寨溝・黄龍"> <br>⑤中国 九寨溝・黄龍</a></td> ⑥<td width="25%"><a href="../../../jkeirin/jkeirin.html"> <img src="rikouD9s.jpg" width="149" height="107" border="0" alt="中国 桂林"> <br>中国 桂林</a></td> <td width="25%"><a href="../../../jkeirin/jchokakai/jchokakai.html"> <img src="chokai54s.jpg" width="150" height="107" border="0" alt="武陵源・張家界"> <br>中国 武陵源・張家界</a></td> <td width="25%"><a href="../../../jnzld/jnzld.html"> <img src="queen4s.jpg" width="152" height="105" border="0" alt="ニュージーランド"> <br>ニュージーランド</a></td> </tr> ⑦<tr><td colspan="4"> </td></tr> ⑧<tr align="center"> <td><a href="../../../jfuji/fuji.html"> <img src="y0399s.jpg" width="141" height="106" border="0" alt="富士山"> <br>富士山</a></td> <td ><a href="../../../jtaisetu/taisetu.html"> <img src="920082s.jpg" width="153" height="102" border="0" alt="大雪山の紅葉"> <br>大雪山の紅葉</a></td> <td><a href="../../../jkouran/kouran.html"> <img src="y21c3s.jpg" width="150" height="102" border="0" alt="香嵐渓"> <br>香嵐渓</a></td> <td><a href="../../../jtanzawa/tanzawa.html"> <img src="spr408rs.jpg" width="137" height="99" border="0" alt="丹沢のページ"> <br>丹沢のページ</a></td> </tr> </table> ⑨<hr size="5" color="#663300" width="720"> <a href="../kihon1.html"> <img src="next_ts.gif" width="80" height="20" border="0" align="middle"></a> <a href="⑩mailto:lvh09931@biglobe.ne.jp"> <img src="a018ani.gif" border="0" align="middle">⑪ ご意見等はメール</a> でお願いします <a href="⑫http://tohoho.wakusei.ne.jp/html/index.htm" ⑬target="_blank"> タグの詳細はこちら <img src="tohoho.gif" width="88" height="31" border="0" align="middle" alt="とほほさんのページ"></a> </center> <hr size="5" color="#663300" width="720"> ⑭</center></body></html> 
|
以上の作業で13種のタグで、右のようなページが完成しました。→ |
