目次
<a>
<a>要素は
- 他のウェブページやファイル
- 同じページ内の指定箇所
- メールアドレス
- 電話番号
へのハイパーリンクを作成します。
属性
download
href 属性で指定したファイルをダウンロードするようにウェブブラウザに示します。
download 属性に指定した値がダウンロード時のファイル名になります。
ファイル名を指定しない場合（sample.png で保存されます。）
<a href="sample.png" download>画像を保存</a>
ファイル名を指定した場合（image という名前で保存されます。）
<a href="sample.png" download="image">画像を保存</a>
href
href 属性には
- 他のページへのリンク
- ダウンロードさせたいファイルのリンク
- id 属性の値
- メールアドレス
- 電話番号
を指定することができます。
① 他ページへのリンク
表示させたいリンクを指定することができます。
<a href="http://google.com">Googleへ移動</a>
② ダウンロードリンク
ダウンロードできるファイルを指定することができます。
<a href="sample.png" download>画像を保存</a>
③ id 属性の値
同じページ内にある id 属性の場所に移動することができます。
<a href="#message">「id="message"」の箇所へ移動</a>
④ メールアドレス
mailto:メールアドレスを指定すると、メールソフトが起動してメールを作成できます。
<a href="mailto:test@mail.com">メール送信</a>
⑤ 電話番号
携帯電話の場合は、tel:電話番号を指定するとそのまま発信することができます。
<a href="tel:0312345678">電話をかける</a>
hreflang
リンク先のファイルの言語を指定します。補足メッセージのようなもので、組み込まれている機能はありません。
<a href="#" hreflang="ja">リンク</a>
ping
ブラウザによって送信される URL のリストです。通常トラッキングに使用されます。
rel
リンク先の内容の役割をリンク種別の値で指定します。
<a href="#" rel="noreferrer">リンク</a>
参考：HTML リンク種別まとめ – HTML リファレンス
target
リンク先のファイルを開く場所・コンテキスト（ブラウザのタブ・ウィンドウなど）を指定します。
| 値 | |
|---|---|
| _self（既定値） | 表示中のページと同じウィンドウにリンク先のページを表示します。 |
| _blank | 新しいタブ・ウィンドウでリンクを開きます。 |
| _parent | 現在閲覧中のタブ・ウィンドウの親コンテキストにリンク先のページを読み込みます。親がない場合は _self と同じ動きをします。 |
| _top | トップレベル（親を持たない）の閲覧コンテキストにリンク先のページを読み込みます。親がない場合は _self と同じ動きをします。 |
新しいタブでリンクを表示するサンプル
<a href="http://google.com" target="_blank">Googleを表示</a>
type
リンク先の MIME タイプを指定します。補足メッセージのようなもので、組み込まれている機能はありません。
<a href="sample.png" type="image/png" download>PNG画像を保存</a>
グローバル属性
全ての HTML 要素に共通して使用できるグローバル属性はこちら
廃止された属性
charset, coords, name, rev, shape 属性は廃止されました。
使用例
例① リンクを新しいタブで開く
<a href="http://google.com" target="_blank">Googleを表示</a>
例② ファイルのダウンロードリンク
<a href="sample.png" download>画像を保存</a>
例③ メールソフトの起動
<a href="mailto:test@mail.com">メール送信</a>
例④ 電話をかける
<a href="tel:0312345678">電話をかける</a>
対応ブラウザ
