リンクの補足説明

☆リンクの補足説明

◎ ＜A HREF="***"＞☆☆☆＜/A＞ がリンクさせるタグです。

「***」のところにはリンク先を指定します。(保存場所とファイル名)

「☆☆☆」のところにはタイトル文字あるいは画像を入れます。

※ ブラウザ上では「☆☆☆」だけが表示され、「☆☆☆」をクリックすると***で指定したリンク先（ファイル）に画面が移るしくみになっています。

☆サンプル雛形ページ、ソースの内容

◎ サンプル（１）

※リンクのサンプルは新しいウインドが開いて表示されます
サンプルの確認が終わったら「×」で閉じてください。

「サンプル（１）」はサンプルページ（２）へリンクしています。
「（２）へ」をクリックしてサンプルページ（２）へ移動します

ソースの内容

<HTML>

<HEAD>
<TITLE>リンクサンプル（１）</TITLE>
</HEAD>

<BODY>

<CENTER>

リンク・サンプルファイル（１） 

<A HREF="memohplinksample2.html">（２）へ</A>

</CENTER>

</BODY>

</HTML>

◎ サンプル（２）

サンプルページ（３）と（１）へリンクしています。
それぞれ、クリックしてサンプルページ（３）あるいは（１）へ移動します

ソースの内容

<HTML>

<HEAD>
<TITLE>リンクサンプル（２）</TITLE>
</HEAD>

<BODY>

<CENTER>

リンク・サンプルファイル（２） 

このページが表示されているってことはちゃんとリンクしたんですよね。 

よかった！ 

よかった！ 

<A HREF="memohplinksample3.html">（３）へ進む</A> 

<A HREF="memohplinksample1.html">（１）へ戻る</A> 

</CENTER>

</BODY>

</HTML>

◎ サンプル（３）

リンク上の注意として相対パスと絶対パスとがあります。
相対パスと絶対パスの説明ページを参照して上で内容を確認して下さい。

相対パスでサンプルページ（１）へリンクしています。
「メモ帳で作るホームページ」Top Pageへは相対パス・絶対パスの両方でリンクしています。

それぞれ、クリックしてリンクしているか確認してください。

ソースの内容

<HTML>

<HEAD>
<TITLE>リンクサンプル（３）</TITLE>
</HEAD>

<BODY>

<CENTER>

リンク・サンプルファイル（３） 

<A HREF="memohplinksample1.html">相対パスで（１）へ戻る</A> 

<A HREF="memohp00_0.html">相対パスで「メモ帳だけで作るホームページ」Top Pageへ</A> 

<A HREF="http://homepage2.nifty.com/iwatako1up/memohp/memohp00_0.html">
絶対パスで「メモ帳だけで作るホームページ」Top Pageへ</A> 

</CENTER>

</BODY>

</HTML>

◎ リンクの属性＜TARGET＝”_blank”＞

通常にリンク指定タグを記入したときは、現在表示しているウインドウにそのままリンクされているファイルが表示されます。
しかし、現在のウインドウをそのままの状態で、新たなウインドウを開きリンク先を表示させるという方法があります。
それが、上記のタグです。

※ タグ記入例

<A href="xyz.html" TARGET="_blank">xyzファイルへ</A>

意味
「xyzファイルへ新しいウインドウを開いて表示するようにリンクさせます」

※ その他にもリンクタグの属性はあります
＜TARGET＝”～～～”＞の「～～～」部分にいろいろ属性タグを記入することによっていろいろな表示方法ができます。

この先は
フレームの学習（３）「フレーム内からのリンク」の項目で詳しく説明します。

リンクさせるときの注意点（相対パスと絶対パス）へ

リンク・サンプルページ（１）へ

リンク・サンプルページ（２）へ

リンク・サンプルページ（３）へ

※リンクのサンプルページは新しいウインドウが開いて表示されます
サンプルの確認が終了したら右上の「×」ボタンで閉じてください

利用方法の説明ページへ