HTML - a 要素

概要

名前
a
カテゴリー
  • Flow content
  • Phrasing content
  • Interactive content (href属性がある場合のみ)
  • Palpable content
配置できる場所
Phrasing content が期待される場所
コンテンツモデル
Transparent content。ただし、Interactive content、または別の a 要素の祖先になってはいけない。
説明
href 属性が指定されている場合、a 要素はその要素内容をラベルとするリンクになります。href 属性が指定されていない場合、a 要素はプレースホルダーになります。また、href 属性が指定されていない場合は、rel 属性、rev 属性、hreflang 属性、type 属性、target 属性、download 属性 は指定できません。
タグの省略
開始タグも終了タグも省略できません。
DOM Interface
HTMLAnchorElement
仕様書
仕様書策定状況コメント
LS:現行の標準
REC:勧告
REC:勧告
サポートブラウザ
ie
IE
edge
Edge
firefox
Firefox
chrome
Chrome
safari
Safari
opera
Opera
safari
iOS Safari
android
Android
◯:Support ✕:Not Support ?:未定義 n:以降の Version で Support

属性

サポートブラウザ
属性名 ie
IE
edge
Edge
firefox
Firefox
chrome
Chrome
safari
Safari
opera
Opera
safari
iOS Safari
android
Android
charset
coords
charset18201410.115
href
hreflang
name
ping
referrerpolicy505111.13851
rel
rev
shape
target
type
◯:Support ✕:Not Support ?:未定義 n:以降の Version で Support
グローバル属性
すべての要素で共通に利用できるグローバル属性を指定できます。
download
この属性は、URL に移動するのではなくダウンロードするようブラウザへ示しますので、ユーザはローカルファイルとして保存することを促されます。属性に値を指定した場合、保存プロンプトの既定のファイル名として解釈します (ユーザは必要に応じてファイル名を変更できます)。使用可能な値に制限はありませんが、/ および \ はアンダースコアに変換します。多くのファイルシステムにはファイル名に使用できる文字の制限があり、ブラウザがファイル名を調整するかもしれません。
  • この属性は同一オリジンの URL に限り動作します。
  • HTTP(s) の URL は同一オリジンにある必要がありますが、JavaScript で生成したコンテンツのために、blob: の URL および data: の URL も許可されています。
  • Content-Disposition: HTTP ヘッダーでこの属性の指定と異なるファイル名が与えられた場合は、この属性より HTTP ヘッダーが優先します。
  • Content-Disposition: で inline を指定している場合、Firefox はファイル名と同様に Content-Disposition を優先しますが、Chrome は download 属性を優先します。
href
ハイパーリンクが指す先を URL または URL フラグメントで示します。URL フラグメントは、# で始まり、現在の文書内のリンク先位置 (html 要素id 属性) を指定します。URL はウェブ (HTTP) ベースの文書に制限されず、ブラウザが対応するあらゆるプロトコルを使用することができます。例えば、file:ftp:mailto: などがほとんどのブラウザで動作します。また、現在のページの最上部へのリンクとして href="#top" または空のフラグメント href="#" を使用できます。
hreflang
この属性は、リンク先のリソースの人間の言語を示します。許容される値は、BCP47 で定められています。
referrerpolicy
URL を読み込む際にどのリファラーを送信するかを示します。
  • 'no-referrer' は、Referer: ヘッダーを送信しないことを表します。
  • 'no-referrer-when-downgrade' は、HTTPS を使用せずにオリジンへ移動する場合は Referer: ヘッダーを送信しないことを表します。これは既定の動作です。
  • 'origin' は、ページの オリジン (ドメイン以降の情報を含まない) をリファラーとすることを表します。
  • 'origin-when-cross-origin' は、異なるオリジンへの移動ではリファラーをスキーム、ホスト、ポートに制限します。同一オリジンへの移動では、リファラーのパスも含めます。
  • 'unsafe-url' は、リファラーにオリジンとパスを含めることを表しますが、フラグメント、パスワード、ユーザ名は除きます。これはセキュアな URL からセキュアでない URL へデータが漏えいしますので、安全ではありません。
rel
対象オブジェクトとリンクオブジェクトとの関係を指定します。属性値は、空白で区切られたリンク種別の値のリストです。
alternate
代替スタイルシートを定義します。この場合は title 属性が必須であり、空文字列にすることはできません。
archives
この文書へのアーカイブリンクを含む文書へのハイパーリンクを定義します。例えば、ブログ記事はこの方法を使用して、月別の目次へリンクできます。archives 属性は廃止された API であり、今後の動作は保障されていません。
author
作者について説明するページへのハイパーリンク、または作者への連絡方法を定義します。author 属性に mailto: を設定した場合、大量のスパムが送信される可能性があるため推奨されません。その場合、連絡フォームを設置したページに誘導する方法が推奨されます。
bookmark
ハイパーリンクが、もっとも近い祖先の article 要素へのパーマリンクであることを示します。article 要素が存在しない場合は、もっとも密接に結びつけられたセクションへのパーマリンクになります。月ごとのブログ記事一覧やブログアグリゲーターなど複数の記事を含むページで、単独の記事をブックマークすることができます。
external
ページが存在するサイトの外部にあるリソースへのハイパーリンクであることを示します。つまり、現在のサイトから離れるリンクです。
first
現在のページが属する一連のリソース群で、最初のリソースへ移動するリンクであることを示します。一連のリソースへのリンクに関するリンク種別として、この他に lastprevnext があります。ただし、この一連の属性は廃止された API であり、今後の動作は保障されていません。
help
ページ全体について詳細なヘルプを提供するリソースへのリンクであることを示します。
index
当該ページは階層構造を持つ文書群の一部であり、階層のトップレベルのリソースへのハイパーリンクであることを示します。index 属性は廃止された API であり、今後の動作は保障されていません。
last
現在のページが属する一連のリソース群で、最後のリソースへ移動するリンクであることを示します。一連のリソースへのリンクに関するリンク種別として、この他に firstprevnext があります。ただし、この一連の属性は廃止された API であり、今後の動作は保障されていません。
license
ライセンス情報を説明する文書へ誘導するハイパーリンクを定義します。head 要素内に配置しない場合に、文書内の一部に適用するか文書全体にするかの区別は標準化されていません。ページ上のデータだけが、ライセンスを示すことができます。
next
現在のページが属する一連のリソース群で、最後のリソースへ移動するリンクであることを示します。一連のリソースへのリンクに関するリンク種別として、この他に firstprevlast があります。ただし、この一連の属性は廃止された API であり、今後の動作は保障されていません。
nofollow
リンク先の文書は、リンク元ページの作者が推薦するものではないことを示します。例えば作者が管理しているものではない、悪い例である、あるいは二者間に営利関係がある(販売用のリンク)などです。このリンク種別は、人気ランキングの測定技術として検索エンジンが使用するかもしれません。
noopener
リンクを新しい閲覧コンテキストで開き、リンク元の文書へアクセスできないようにすることをブラウザに指示します。つまり、新たに開いたウィンドウで Window.opener プロパティを設定しません(null を返します)。これは信頼できないリンクを開く際、Window.opener プロパティでリンク元の文書を変更できないようにするために特に役に立つリンク種別です。ただし、Referer HTTP ヘッダーは(noreferrer を使用しない限り)提供します。なお、noopener を使用すると、_top_self_parent 以外の空文字列ではないターゲット名がすべて、新しいウィンドウやタブを開くかという点で _blank と同様に扱われれます。
noreferrer
別のページへ移動する際にリンク元ページのアドレスなどの値を、ブラウザが Referer: HTTP ヘッダーでリファラーとして送信しないようにします。
prev
現在のページが属する一連のリソース群で、前のリソースへ移動するリンクであることを示します。一連のリソースへのリンクに関するリンク種別として、この他に firstnextlast があります。ただし、この一連の属性は廃止された API であり、今後の動作は保障されていません。
search
ハイパーリンクが、この文書やサイトとそのリソースを検索するために特別に設計されたインターフェイスを持つ文書を参照することを示します。
tag
この文書に適用するタグを説明する文書へのハイパーリンクであることを示します。このリンク種別は、タグクラウドの項目に設定すべきではありません。これらは単一の文書ではなく、ページの集合体へのリンクであるためです。
up
当該ページは階層構造を持つ文書群の一部であり、階層の上位レベルのリソースへのハイパーリンクであることを示します。up リンク種別の数で、当該ページとリンク先文書の階層の差を示します。up 属性は廃止された API であり、今後の動作は保障されていません。
target
リンク先の URL を表示する場所を指定します。これは、閲覧コンテキスト (タブ、ウィンドウ、iframe) の名前またはキーワードです。
  • _self: 現在と同じ閲覧コンテキストに URL を読み込みます。これは既定の動作です。
  • _blank: 新しい閲覧コンテキストに URL を読み込みます。通常はタブですが、新しいウィンドウを使用するようにブラウザを設定できます。
  • _parent: 現在の閲覧コンテキストの親コンテキストに URL を読み込みます。親がない場合は、_self と同じ振る舞いをします。
  • _top: トップレベルの閲覧コンテキスト (現在のコンテキストの祖先で "最上位" の閲覧コンテキストであり、親を持たない) に URL を読み込みます。親閲覧コンテキストがない場合は、_self と同じ振る舞いをします。
target を使用する際は、window.opener API の悪用を避けるために rel="noreferrer" の追加を検討してください。target="_blank" を使用して他のページにリンクすると、新しいページが現在のページと同じプロセスで実行されます。もし新しいページで負荷の高い JavaScript が実行されると、現在のページの性能が影響を受けます。これを避けるには、rel="noopener" を使用してください。
type
リンク先 URL の MIME タイプの形式を表すメディアタイプを指定します。これは純粋に助言的なもので、組み込まれている機能は組み込まれている機能はありません。

非推奨の属性

以下の属性は非推奨、非標準、実験的、または廃止された属性のため、使用しないでください。

charset
非推奨。新しいウェブサイトでは使用しないでください。
coords
非推奨。新しいウェブサイトでは使用しないでください。
name
非推奨。新しいウェブサイトでは使用しないでください。
ping
実験的。動作が変更される可能性があります。
rev
非推奨。新しいウェブサイトでは使用しないでください。
shape
非推奨。新しいウェブサイトでは使用しないでください。

サンプルコード

a 要素のサンプルコードは以下のとおりです。

<!-- 外部ファイルにリンクするアンカー -->
<a href="https://murashun.jp/">
外部リンク
</a>
a 要素のサンプルコード

関連記事