HTML <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 属性が存在する場合にのみ使用します。
|
| type New | MIME_type | ターゲット URL の MIME タイプを指定します。href 属性が存在する場合にのみ使用します。 注:MIME = Multipurpose Internet Mail Extensions。 |
グローバル属性
<a> タグのサポートHTML のグローバル属性。
イベント属性
<a> タグのサポートHTML のイベント属性。
試してみる - 例
この例では、HTML ドキュメント内でリンクを作成する方法を示します。
この例では、画像をリンクとして使用する方法を示します。
この例では、新しいウィンドウでページを開く方法を示します。これにより、訪問者はサイトを離れる必要がありません。
この例では、メールへのリンク方法を示します。(この例は、メールクライアントプログラムがインストールされている場合にのみ機能します。)
この例では、より複雑なメールリンクを示します。
この例では、アンカーの id 属性を使用してページの別の場所にジャンプする方法を示します(HTML5 は name 属性をサポートしていません)。
関連記事
HTML チュートリアル:HTML リンク
HTML DOM リファレンス:Anchor オブジェクト
その他の拡張