ハイパーリンク

ページとページをつなぐリンクのことをハイパーリンクとよびます。そのハイパーリンクについての説明です。

画像やファイルへリンクを貼る際のパス(URL)の指定方法には、「絶対パス」と「相対パス」の2つがあり、どちらを使用してもOKです。

◆絶対パス(絶対URL)→ http:// から書き始めるもの

主として他サイトへのリンクに使用します。たとえばYahooへのリンクを貼る場合は、

http://www.yahoo.co.jp/

と指定します。

◆相対パス(相対URL)→ 目的のファイルがそのファイルに対してどこにあるかを指定するもの

主として自分のサイト内のページへのリンクに使用します。

《同じフォルダ内の x.html への指定方法》

x.html

同じフォルダ内のファイルを指定するときは、そのまま「ファイル名」の形で指定します。

《1つ上のフォルダ内の x.html への指定方法》

../x.html

1つ上のフォルダ内のファイルを指定するときは「../ファイル名」の形で指定します。2つ上の場合は 「../../ファイル名」で指定します。

《同じフォルダ内のxyフォルダ内にある x.html への指定方法》

xy/x.html

「フォルダ名/ファイル名」の形で指定します。
<a href="URL">テキスト</a> で、他のページへのリンクを貼ることができます。

<a href="menu.html">menu.htmlのページ</a>

《表示結果》

menu.htmlのページ
<a href="#リンク先">テキスト</a> で、<a name="リンク先">テキスト</a> へのリンクを貼ることができます。長いページを見やすくするために使います。

<a href="#link">特定位置へのリンク</a>


<a name="link">特定位置へのリンク</a>

《表示結果》

特定位置へのリンク


特定位置へのリンク
<a href="リンク先" target="_blank">新しいウインドウで開く</a> で、リンク先を新しいウインドウで開くことができます。

<a href="menu.html" target="_blank">新しいウインドウで開く</a>

《表示結果》

新しいウインドウで開く
なお、すべてのやり方において、テキストの部分を画像 <img src="画像のURL"> に置きかえることも可能です。

>>HTML講座メニューへ戻る