HPデビュー！（ＨＰ作成講座-超初級編）
その６（画像の挿入、音楽の挿入、リンクを張る）

　　　　　　　　　

ステップ リンクのページをつくる
下のファイルを作成後、ファイルの名前をlink.htmlとして実験フォルダ内に保存する。
　また、リンク先のバーナー（kazoku3.gif,kyupibanner.png,namakemono-bana.gif）についてはDL（ダウンロード）し既に実験フォルダの中にあるものとする。
　DLの仕方。。。DLする画像を選択し、右クリック「名前を付けて画像を保存」を選択し、保存先を実験フォルダとする。そうすれば実験フォルダ内に画像がゲットされたことになります。また、保存の際自分がわかりやすい名前に（例えば、namakemono-bana.gifとか）変えておくと後々便利だと思います！その場合名前は半角英数で保存させるようにしてください！間違ってもドリアン.gifとか全角で保存するとジオシティにファイルがUPされませんので気をつけてください！
１ <HTML>
<HEAD>
<TITLE>リンク</TITLE>
</HEAD>
<BODY background="ao2.png">
<P align="center"><B><FONT size="+1">リンクのページ
</FONT></B></P>
<TABLE border="1">
<TBODY>
<TR>
<TD>バーナー</TD>
<TD>製作者</TD>
<TD>コメント</TD>
</TR>
<TR>
<TD><A href="http://www.geocities.co.jp/HeartLand-Kaede/5715/" target="_blank"><IMG src="kazoku3.gif" width="88" height="31" border="0"></A></TD>
<TD>ドリアン</TD>
<TD>自分で自分を宣伝しなくても、ここ身内しかこないでしょ！</TD>
</TR>
<TR>
<TD><A href="http://homepage2.nifty.com/A-home/" target="_blank">
<IMG src="kyupibanner.png" width="96" height="42" border="0"></A></TD>
<TD>Sweep</TD>
<TD>素材屋さんらしい。。。らしい。。。というとこに注目！ルピでであった。</TD>
</TR>
<TR>
<TD><A href="http://www.geocities.co.jp/AnimalPark-Tama/7506/index.html" target="_blank"><IMG src="namakemono-bana.gif" width="150" height="69" border="0"></A></TD>
<TD>なまけもの★</TD>
<TD>ここのＨＰ作成講座の受講者らしい。。。たまに更新がないとせかしてくる！</TD>
</TR>
</TBODY>
</TABLE>
</BODY>
</HTML>
画像の挿入 画像挿入のタグは<IMG src="画像ファイル名.gif">となります。gifの他にjpgなどいろいろあります。
ステップ リンク先のページを特定のフレームに表示するには。。。
先ほど、作成したフレームページでリンクをクリックするとメニューのフレームの中にリンク先が表示されてしまいます。ここでは、リンク先を特定のフレームに表示させる調整をします。
１
frame.htmlの変更箇所は赤字の部分です。変更後上書き保存させてください。

<HTML>
<HEAD>
<TITLE>フレーム </TITLE>
</HEAD>
<FRAMESET cols="26%,*">
<NOFRAMES>
<BODY>
<P>このページをご覧いただくにはフレーム対応のブラウザが必要です。</P>
</BODY>
</NOFRAMES>
<FRAME src="menu.html" name="menu" scrolling="AUTO">
<FRAME src="mein.html" name="contents" scrolling="AUTO">
</FRAMESET>
</HTML>
２
menu.htmlの変更箇所は赤字の部分です。変更後上書き保存させてください。

<HTML>
<HEAD>
<TITLE>メニュー
</TITLE>
</HEAD>
<BODY background="ao2.png">
<BR>
<IMG SRC="@geocounter">
<BR>
<BR>
メニュー
<P><A href="mein.html" target="contents">メインページ</A><BR>
<A href="profiel.html">プロフィール</A><BR>
<A href="http://www.accessup.net/cgi-bin/bbs.cgi?dori4770" target="contents">掲示板</A><BR>
<A href="http://www.provide2.jpn.org/diary_c/diary.cgi?id=0421ta" target="_blank">日記帳</A><BR>
<A href="link.html" target="contents">リンク</A><BR>
</P>
<HR>
<P><A href="mailto:tama@sake.cc">
<IMG src="m_neko.gif" alt="ＨＰ作成講座より"border="0">←メール</A></P>
</BODY>
</HTML>
リンクの挿入 　
リンクの挿入のタグは<A href="URL" target="_blank">となります。

　「target="_blank"」は、名前のないウィンドウを新しく開き、そこへリンク先のページを表示します。
　「target="_top"」は、ウィンドウのフレームをすべて解除し、そこへリンク先のページを表示します。フレーム内のページから他のサイトへのページを張るときは、「target="_top"」を記述しておかないと、フレーム内に別のサイトを表示してしまいます。
　「target="_self"」は、リンク元のページと同じフレームに表示します。これは、traget属性を指定しなかった場合と同じです。
　「target="_parent"」は、フレームを１つ解除してリンク先を表示します。なお、３つ以上のフレームに分渇した状態でこの属性値を機能させるには、分割したフレームに別のファイルでフレーム分割を指定しておく必要があります。
　
音楽の挿入 ここでは、メインのページに音楽を貼り付けて見ることにします。
mein.htmlの変更箇所は赤字の部分です。なお、前提として実験フォルダ内にmid（音楽）ファイルがあるものとします。

<HTML>
<HEAD>
<TITLE>メインページ
</TITLE>
</HEAD>
<BODY background="ao2.png">
<P><EMBED src="Firstlove.mid" autostart="true" hidden="true" loop="true"></P>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<P align="center"><FONT color="red"><FONT size="+4"><B><I>メインページ</I></B>
</FONT></FONT></BODY>
</HTML>