HTML文章中にアンカーを指定しておくことによって、 その場所にリンクすることができます。

ここでは、アンカーのつけ方とその場所へのリンクの張り方についてみていくことにしましょう。

a要素の場合

<a name="sample">name属性</a>

a要素のname属性を用いてアンカーを設定することができます。 上の例では、「name属性」という文字列に対して、 「sample」というアンカー名でアンカーを指定しています。

他の要素の場合

<h1 id="sample2">id属性</h1>

a要素以外では、id属性を用いてアンカーを設定することができます。 上の例では、「id属性」という見出しに対して、 「sample2」というアンカー名でアンカーを指定しています。

アンカー名は、各HTML文章で重複してはならず、 大文字と小文字の区別もつけるようにしてください。

アンカーの設定方法を説明したところで、 そのアンカーにリンクを張る方法を見ておきましょう。

ここでは、例として同じHTML文章内にあるアンカーへのリンクを張ってみますが、 異なるHTMLページ内のアンカーへのリンクや、 インターネット上のHTML文章内にアンカーが設定されていれば、 そのアンカーへリンクを張ることもできます。

以下に上で設定したアンカーへのリンクを張っておきますので、 どのような動作になるか確認してみてください。

<a href="#sample">name属性へ</a>

<a href="#sample2">id属性へ</a>

同じサーバ内の別のHTML文章内のアンカーにリンクを張るには以下のようにします。 動作を確認してみてください。

<a href="html14_2.html#rela">内部へのリンク</a>

インターネット上のHTML文章にアンカーが張ってある場合には、 その場所にリンクを張ることもできます。 以下に例を示しておきます。

<a href="http://www.rakuten.co.jp/tsukumo/487433/498899/#483177">
二足歩行ロボット組み立てセット</a>