a 要素

a 要素が href 属性を持つ場合、それはリンクアンカーを表します。

a 要素が href 属性を持たない場合は、その要素はプレースホルダーを表します。例えばまだリンク先がまだ存在しない、あるいは存在したが削除された場合など、href 属性を持たない a 要素を配置することでダミーリンクとすることができます。

なお、href 属性が省略された場合、target、download、ping、rel、hreflang、type、referrerpolicy 各属性は省略しなければなりません。一方で、itemprop 属性が指定される場合、href 属性は必須となります。

また、リンク先に文書内の特定の場所 （フラグメント） を指定することで、その場所へのリンクになります。対象となる要素に id 属性を使用して名前を付けておき、a 要素の href 属性値に #名前 という形式で指定することで、その場所に移動することができます。所謂 「アンカーリンク」、「ページ内リンク」 などと呼ばれるものです。

なお、HTML Standard 仕様では、href 属性を href="#top" と指定することで、文書内に 「top」 というフラグメント （id="top"） がない場合でも、自動的に文書先頭へのリンクになることが仕様内に明記されました （下記リンク参照）。

• 7.8.9 Navigating to a fragment : HTML Living Standard

a 要素のコンテンツモデルはトランスペアレント・コンテンツです。トランスペアレント・コンテンツとなる要素は、その親要素のコンテンツモデルを受け継ぎます。

例えば、a 要素がフロー・コンテンツをコンテンツモデルに持つ要素内の子要素として使われる場合、そのコンテンツモデルもフロー・コンテンツとなります。

これによって a 要素は HTML 4.01 などでは許されていなかった p 要素や div 要素、section 要素などを内包することが可能になりました。

なお、a 要素は、他のインタラクティブ・コンテンツを内包することはできません。a 要素が入れ子になっていたり、button 要素などを a 要素の子孫として使用することはできません。

属性について

href、target 属性は、ユーザーが a 要素によって生成されたリンクをたどる際の挙動を制御します。また、rel、media、hreflang、type 属性は、ユーザーがリンクをたどる前に、ターゲットとなるリソースに関する情報をユーザーに提供するために使用できます。

<!-- ナビゲーションを作成した例。href 属性が省略された a 要素の例も -->
<nav role="navigation">
 <ul>
  <li><a href="/">トップページ</a></li>
  <li><a href="/news/">ニュース</a></li>
  <li><a>事例紹介</a></li>
  <li><a href="/legal/" target="_blank">使用許諾条件</a></li>
 </ul>
</nav>

<!-- セクション全体を a 要素でリンクにした例 -->
<aside class="advertising">
 <h1>広告掲載について</h1>
 <a href="/example.html" title="広告掲載についての詳細ページへ">
  <section>
   <h1>広告募集中です</h1>
   <p>月額 100円から掲載可能です。</p>
   <p>詳しい料金設定などはこちらのページをご確認ください。</p>
  </section>
 </a>
</aside>

<!-- 様々なリンクの例 -->
<ul>
 <li>メールアドレス： <a href="mailto:user@example.com">user@example.com</a></li>
 <li><a href="english.html" hreflang="en">英語ページ</a></li>
 <li><a href="photo.jpg" type="image/jpeg">拡大写真を見る</a></li>
 <li><a href="print.html" media="print">印刷ページへ移動</a></li>
</ul>

<!-- 間違った使い方の例： 他のインタラクティブ・コンテンツを子孫にすることはできません -->
<p>
 <a href="example.html">
  <button type="button">ボタン</button>
 </a>
</p>

IE11	○
Edge（EdgeHTML）	○
Edge（Chromium）	○
Chrome	○
Firefox	○
Safari	○
iOS Safari	○
Android Chrome	○