a要素 -- アンカー

基本データ

a要素
文書型 適用 子要素 開始タグ 終了タグ 分類
Strict インライン要素(a要素を除く) 必須 必須 インライン要素
Transitional
Frameset

属性

固有属性

href="URI"
Strict: ○ | Transitional: ○ | Frameset: ○
リンクする文書のURIを指定します。
name="名前"
Strict: ○ | Transitional: ○ | Frameset: ○
リンクの終点アンカーとなる名前をつけます。一つのHTML文書中で2箇所以上に同じ名前をつけることはできません。id属性でも名前をつけることができますが、その際はname属性と同じ値にしなければいけません。
rel="リンクタイプ"
Strict: ○ | Transitional: ○ | Frameset: ○
リンク先の文書のリンクタイプを指定します。スペースで区切って複数記述できます。次のようなリンクタイプがよく利用されます。
start
最初の文書を表します。いわゆるトップページです。
next
次の文書を表します。
prev
前の文書を表します。
contents
目次を表します。
rev="リンクタイプ"
Strict: ○ | Transitional: ○ | Frameset: ○
リンク先の文書から見た、この文書のリンクタイプを指定します。スペースで区切って複数記述できます。
type="MIMEタイプ"
Strict: ○ | Transitional: ○ | Frameset: ○
リンクする文書のMIMEタイプを指定します。
charset="文字コード"
Strict: ○ | Transitional: ○ | Frameset: ○
リンク先の文書の文字コードを指定します。
hreflang="リンク先の言語"
Strict: ○ | Transitional: ○ | Frameset: ○
リンク先の文書の言語コードを指定します。
shape="領域の形"
Strict: ○ | Transitional: ○ | Frameset: ○
領域の形を指定します。指定できる値は次のとおりです。
default
画像全体
rect
長方形
circle
poly
多角形
coords="領域の座標"
Strict: ○ | Transitional: ○ | Frameset: ○
領域の座標をカンマ(,)で区切って指定します。画像の左上を(x, y)=(0, 0)とします。shape属性の値(領域の形)によって座標の形式が違います。
shape="rect"(長方形)のとき
左上x,左上y,右下x,右下y
shape="circle"(円)のとき
中心x,中心y,半径
shape="poly"(N角形)のとき
x1,y1,x2,y2,…,xN,yN,x1,y1
頂点のx座標をy座標を順番に指定します。最初と最後に同じ座標を指定して多角形を閉じます。
tabindex="タブの順番"
Strict: ○ | Transitional: ○ | Frameset: ○
タブの移動する順番を指定します。指定できる値は0?32767です。ユーザーがTABを押すと、タブインデックスの小さい順にフォーカスが移動します。tabindex="0"を指定した要素やtabindex属性を持たない要素は、tabindex属性の値が最も大きい要素にフォーカスが移動した後、順番に選択されます。
accesskey="アクセスキー"
Strict: ○ | Transitional: ○ | Frameset: ○
アクセスキーを指定します。Windows用のInternet ExplorerならAltキーとアクセスキーの同時押しで、要素にアクセスします。どのような動作をするかはブラウザによって異なります。
target="フレーム名"(非推奨)
Strict: × | Transitional: △ | Frameset: △
リンク先の文書を開く先となるフレーム名を指定します。この属性は非推奨です。

解説

リンクの出発点や到達点を表す要素です。この要素はインライン要素です。中身にはa要素以外のインライン要素を含むことができます。

出発点や到達点のことをアンカーと言います。リンクを作るには、リンクの出発点(始点アンカー)を<a …></a>で囲み、リンクの到達点(終点アンカー)をhref属性に記述します。

<p>HTMLに関する詳しい情報は
<a href="http://www.w3.org">W3Cのサイト</a>で得られます。</p>

HTMLに関する詳しい情報はW3Cのサイトで得られます。

href属性には「http://」で始まる絶対URIのほか、相対URIを指定することもできます。

<p><a href="index.html">HTML 4.01リファレンス 目次</a></p>

URIのスキームを「mailto」にすれば、メールアドレスにリンクすることができます。

<p>問合せ先:<a href="mailto:elastic965@gmail.com">elastic965@gmail.com</a></p>

問合せ先:elastic965@gmail.com

アンカーはリンク先の内容を表すものに

アンカーにする文字列は、リンク先と関係のあるものにしましょう。次のようなリンクはよくありません。

<p>最新情報を追加しました。<a href="news.html">ここ</a>を
クリックしてご覧ください。</p>

リンク先の「news.html」は「ここ」という文字列とは関係ありません。「news.html」と関係のある「最新情報」にアンカーを設置しましょう。

<p><a href="news.html">最新情報</a>を追加しました。</p>

名前をつける際の注意点

name属性の値は大文字小文字が区別されます。そのため次のようにリンクすることはできません。

<h2><a name="TOC">目次</a></h2>
<p><a href="#toc">目次</a></p>

同じ名前を2箇所以上につけることもできません。

<h2><a name="TOC">目次</a></h2>
…
<h2><a name="TOC">目次</a></h2>
<h2><a name="TOC">目次</a></h2>
…
<h2 id="TOC">目次</h2>

また、同じ場所にname属性とid属性で異なる値を指定することはできません。

<h2><a name="TOC" id="Mokuji">目次</a></h2>

SGML的にはid属性の値は大文字に変換されて解釈されることになっています。そのため、文法上はid属性の値が小文字でも、href属性は大文字で書かないといけません。

<h2 id="toc">目次</h2>
<p><a href="#TOC">目次</a></p>

しかし、これを正しく解釈できるユーザーエージェントはあまりありません。ですから、id属性の値を最初から大文字にしておくのが無難です。

<h2 id="TOC">目次</h2>
<p><a href="#TOC">目次</a></p>

古いブラウザ(Internet Explorer 3やNetscape 4.x)はid属性で名前をつける方法に対応していません。

XHTML 1.1ではname属性が廃止され、名前をつけるにはid属性を使うことになっています。

Strict DTDの定義

<!ELEMENT A - - (%inline;)* -(A)       -- anchor -->
<!ATTLIST A
  %attrs;                              -- %coreattrs, %i18n, %events --
  charset     %Charset;      #IMPLIED  -- char encoding of linked resource --
  type        %ContentType;  #IMPLIED  -- advisory content type --
  name        CDATA          #IMPLIED  -- named link end --
  href        %URI;          #IMPLIED  -- URI for linked resource --
  hreflang    %LanguageCode; #IMPLIED  -- language code --
  rel         %LinkTypes;    #IMPLIED  -- forward link types --
  rev         %LinkTypes;    #IMPLIED  -- reverse link types --
  accesskey   %Character;    #IMPLIED  -- accessibility key character --
  shape       %Shape;        rect      -- for use with client-side image maps --
  coords      %Coords;       #IMPLIED  -- for use with client-side image maps --
  tabindex    NUMBER         #IMPLIED  -- position in tabbing order --
  onfocus     %Script;       #IMPLIED  -- the element got the focus --
  onblur      %Script;       #IMPLIED  -- the element lost the focus --
  >

Information

現在の位置