【HTML】aタグ - リンク
HTMLのaタグをご紹介します。
aタグ
aタグはリンク先をマークアップします。
リンク先には別ページリンクやページ内リンク、電話番号、メールアドレスなどがあります。
基本構文
<a href="リンク">コンテンツ</a>属性
主な属性をご紹介します。
| 属性名 | 必須 | 内容 |
|---|---|---|
| href | - | リンク先 |
| target | - | リンク先の表示対象（同じタブ: _self、別タブ: _blank） |
| download | - | リンク先をファイルでダウンロード（属性値はファイル名） |
サンプルコード
URLリンク
<a href="https://it-hack.net">ITHACK</a><a target="_blank" href="https://it-hack.net">ITHACK</a>ページ内リンク
ページ内の特定部分にリンクするには、href属性に#リンク先のid属性値の形式で値を設定します。
※ 次の例のプレビューは動作上、ページ内リンクに遷移しませんので、お手元の開発環境でお試しください。
<a href="#html-file">『HTMLファイル』セクションへのリンク</a>
<h1>HTMLとは</h1>
<p>
HTMLの正式名称は<br>
HyperText Markup Languageです。
</p>
<h2>マークアップ言語</h2>
<p>
マークアップ言語は<br>
テキストを構造化する言語です。
</p>
<h2 id="html-file">HTMLファイル</h2>
<p>
HTMLで記述されたテキストファイルを<br>
HTMLファイルと呼びます。
</p>
<h2>ブラウザ</h2>
<p>
ブラウザは<br>
ChromeやSafari、Microsoft Edge、Firefox<br>
など様々な種類があります。
</p>ダウンロード
<a download="ithack.html" href="https://it-hack.net">ITHACK</a>電話番号
電話番号をリンク先にする場合、href属性の値をtel:電話番号の形式にします。
※ 例の電話番号は実在しないものを記載しておりますが、おかけにならないようしてください。
<a href="tel:012-4567-8901">012-4567-8901</a>メールアドレス
メールアドレスをリンク先にする場合、href属性の値をmailto:メールアドレスの形式にします。
※ 例のメールアドレスは実在しないものを記載しておりますが、送信しないようしてください。
<a href="mailto:example@it-hack.net">example@it-hack.net</a>
