HTML <a>タグ


例

サンプルへのリンク:

<a href="https://www.example.com">サンプルにアクセス!</a>

試してみる »
(その他の例はページ下部を参照)

ブラウザサポート

要素
<a> Yes Yes Yes Yes Yes

すべての主要ブラウザは <a> タグをサポートしています。


タグの定義と使用説明

<a> タグはハイパーリンクを定義し、あるページから別のページへのリンクに使用されます。

<a> 要素の最も重要な属性は href 属性で、リンクのターゲットを指定します。

すべてのブラウザで、リンクのデフォルトの外観は次のとおりです。

  • 未訪問のリンクには下線が付いており、青色です。
  • 訪問済みのリンクには下線が付いており、紫色です。
  • アクティブなリンクには下線が付いており、赤色です。

ヒントと注釈

ヒント:href 属性を使用しない場合、hreflang、media、rel、target、type 属性は使用できません。

ヒント:通常は、他の target が指定されていない限り、リンク先のページは現在のブラウザウィンドウに表示されます。

ヒント:CSS を使用してリンクのスタイルを変更してください。


HTML 4.01 と HTML5 の違い

HTML 4.01 では、<a> タグはハイパーリンクにもアンカーにもなります。HTML5 では、<a> タグはハイパーリンクですが、href 属性がない場合は、ハイパーリンクの単なるプレースホルダーです。

HTML5 にはいくつかの新しい属性があり、HTML 4.01 の一部の属性はサポートされなくなりました。


属性

New:HTML5 の新属性。

属性 値 説明
charset char_encoding HTML5 ではサポートされていません。ターゲット URL の文字エンコーディングを指定します。
coords coordinates HTML5 ではサポートされていません。リンクの座標を指定します。
downloadNew filename ダウンロードリンクを指定します。
href URL リンクのターゲット URL を指定します。
hreflang language_code ターゲット URL の基準言語を指定します。href 属性が存在する場合にのみ使用します。
mediaNew media_query ターゲット URL のメディアタイプを指定します。デフォルト値:all。href 属性が存在する場合にのみ使用します。
name section_name HTML5 ではサポートされていません。アンカーの名前を指定します。
rel alternate
author
bookmark
help
license
next
nofollow
noreferrer
prefetch
prev
search
tag
現在のドキュメントとターゲット URL との関係を指定します。href 属性が存在する場合にのみ使用します。
rev text HTML5 ではサポートされていません。ターゲット URL と現在のドキュメントとの関係を指定します。
shape default
rect
circle
poly
HTML5 ではサポートされていません。リンクの形状を指定します。
target _blank
_parent
_self
_top
framename

ターゲット URL を開く場所を指定します。href 属性が存在する場合にのみ使用します。

  • _blank:新しいウィンドウで開きます。
  • _parent:親ウィンドウでリンクを開きます。
  • _self:デフォルト、現在のページで遷移します。
  • _top:現在のウィンドウでリンクを開き、現在のウィンドウ全体(フレームページ)を置き換えます。
type New MIME_type ターゲット URL の MIME タイプを指定します。href 属性が存在する場合にのみ使用します。
注:MIME = Multipurpose Internet Mail Extensions。

グローバル属性

<a> タグのサポートHTML のグローバル属性。


イベント属性

<a> タグのサポートHTML のイベント属性。


Examples

試してみる - 例


この例では、HTML ドキュメント内でリンクを作成する方法を示します。


この例では、画像をリンクとして使用する方法を示します。


この例では、新しいウィンドウでページを開く方法を示します。これにより、訪問者はサイトを離れる必要がありません。


この例では、メールへのリンク方法を示します。(この例は、メールクライアントプログラムがインストールされている場合にのみ機能します。)


この例では、より複雑なメールリンクを示します。


この例では、アンカーの id 属性を使用してページの別の場所にジャンプする方法を示します(HTML5 は name 属性をサポートしていません)。


関連記事

HTML チュートリアル:HTML リンク

HTML DOM リファレンス:Anchor オブジェクト

その他の拡張