<a> 要素
は、href属性を持っている場合、その内容がハイパーリンク(ハイパーテキスト・アンカー)になります。target
、download
、rel
、hreflang
、href
のいずれの属性も存在しない場合はtype 属性
は指定できません。これまでのHTMLでは、内容にインライン要素しか入れることができませんでしたが、HTML5では親要素に入れられる要素であれば<div> 要素
なども入れることができます。
- カテゴリー
- フロー・コンテンツ、パルパブル・コンテンツ、フレージング・コンテンツ、インタラクティブ・コンテンツ
- 配置場所
- フレージング・コンテンツが置ける場所。
- 内容
- インタラクティブ・コンテンツを除く、親要素に入れられる要素。
- 属性
-
href="URL"
- リンク先のURLを指定します。
<a href="./2nd.html">次のページ</a>
target="ウィンドウ名|キーワード"
- リンク先を表示させるウィンドウ名、または以下のキーワードを指定します。
_blank
新しいウィンドウ _self
現在のウィンドウ _parent
親ウィンドウ、ウィンドウまたは許可が無ければ現在のウィンドウ _top
最上位のウィンドウ、ウィンドウまたは許可が無ければ現在のウィンドウ <a href="https://emwai.jp/reference/html5/" target="_parent">ホーム</a>
download[="download"]
HTML5で追加- リンク先がリソースをダウンロードするためのものであることを示します。
<a href="./document.pdf" download>PDFダウンロード</a>
rel="リンクタイプ"
- リンク先との関係性(リンクタイプ)をキーワードで指定します。複数指定する場合はスペースで区切って指定します。指定したキーワードがいずれも仕様で定義されていないものであればこの要素は意味を持ちません。以下はよく使用されるキーワードの一部です。
参考:http://www.w3.org/TR/2014/REC-html5-20141028/links.html#linkTypesalternate
他言語など現在の文書の代替 next
現在の文書がシリーズの一部であるとして次の文書 prev
現在の文書がシリーズの一部であるとして前の文書 <a href="./plain.html" rel="alternate">簡易版</a>
hreflang="言語コード"
- リンク先の言語コードを指定します。
<a href="./en.html" hreflang="en">英語版</a>
type="MIMEタイプ"
- リンク先のMIMEタイプを指定します。
<a href="style.css" type="text/css">スタイルシート</a>
- グローバル属性
accesskey
,autocapitalize
,autofocus
,class
,contenteditable
,data-*
,dir
,draggable
,enterkeyhint
,hidden
,id
,inputmode
,is
,itemid
,itemprop
,itemref
,itemscope
,itemtype
,lang
,nonce
,spellcheck
,style
,tabindex
,title
,translate
サンプル
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8" />
<title>HTML5 › a</title>
</head>
<body>
<h1>HTML5 › a</h1>
<p>
取り扱いについての詳細は<a href="./document.pdf" download>取り扱い説明書</a>をご覧ください。
</p>
</body>
</html>