同一ページや他のページの途中にリンク


同一ページや他のページの途中にリンクできます。

自分のサイトの同じページ内の指定した場所や、他のページの指定した場所にジャンプ(リンク)させることができます。ID名を指定し、その位置へジャンプさせます。

リンクさせたい位置(リンク先)にid名を指定します。

下記のようなパターンで指定できます。

<div id="aaa">リンクテキスト</div>

要素にid属性を使う
<h3 id="bbb">リンクテキスト</h3>

id名は任意の名前です。半角英数で指定しますが、同じページに同じid名は一度しか使えません。

id名を指定した後に、その位置にジャンプ(リンク)させるタグを記述します。


このページの下の方にジャンプします。
aaaの位置へジャンプ
bbbの位置へジャンプ

同一ページ内にリンクさせるタグです。
リンク元の href="" には、ハッシュ(#)に続けて、リンクさせたいid名を指定します。

<a href="#aaa">aaaの位置へジャンプ</a>
<a href="#bbb">bbbの位置へジャンプ</a>

他のページの指定した場所へジャンプする場合は、id名の前にhtmlファイル名lを追加します。当然ですが、リンク先の他のページにも最初にid名を指定してください。

<a href="sample.html#aaa">サンプルページのaaaの位置へジャンプ</a>
<a href="http://sample.html#aaa">サンプルページのaaaの位置へジャンプ</a>

リンク先ページアドレスは相対パス、urlアドレスどちらも可です。

link 未訪問のリンク
visited 訪問済みリンク
active リンクをクリックしたとき
hover マウスが乗ったとき

リンクの開き方(ターゲット)

<a href="http://sample.jp" target="_blank">サンプルページ</a>

ターゲットtarget はリンク表示(リンクの開き方)の方法です。上記のソースは新しいウィンドウで開きます。

ターゲットの種類

target="_blank" 新しいウィンドウで開きます
target なし 同じページで開きます
target="_top" 全てのフレームを解除して画面全体を表示
target="_self" 同じウィンドウ(フレーム)に表示
target="_parent" 親フレームに表示します。
target="フレーム名" フレームから別フレームに表示します

●当サイトのソースは、IE6.0+のみ動作確認をしております。 それ以外のブラウザでは正しく作動しない場合がございます。ご了承下さい。

リンクテキスト aaaの位置

リンクテキスト bbbの位置