<a>〜</a>
a(アンカー)要素はhref属性を指定した場合はリンクアンカーを表します。href属性を指定していない場合は、リンク先が存在しないダミーリンク「プレスフォルダー(仮のフォルダー)」を表します。
a要素 | 説明 |
---|---|
カテゴリー | ・インタラクティブコンテンツ *インタラクティブ・コンテンツとなるのは、要素が href 属性を持つ場合 ・パルバブルコンテンツ ・フレージングコンテンツ ・フローコンテンツ |
コンテンツモデル | トランスペアレントコンテンツ(親要素のコンテンツモデルを継承)但し、インタラクティブコンテンツを子孫要素に持つことはできない |
使用できる場所 | フレージングコンテンツが期待される場所 |
a要素で使用できる属性
属性名 | 属性値 | 説明 |
---|---|---|
グローバル | すべての要素で使用できる属性 | |
download | ファイル名 imageを指定する場合はファイル名と拡張子(png、jpeg、svgなど) | ダウンロード時のファイル名を指定。 |
href(ハイパー・リファレンス) | リンク先のURIを指定 | href属性を省略した場合はtarget、rel、media、hreflang属性も省略する。 |
rel(リレーション) | リンクタイプ | ・現在の文章から見たリンク先の関係 ・半角スペース区切りで複数指定できる。 |
type | MIMEタイプ | リンク先のMIMEタイプを指定 |
target | _blank:リンクは新しいブラウジングコンテキストに展開される。 _parent:リンクは現在のブラウジングコンテキストの1つ上位のブラウジングコンテキストを対象に展開される。 _self:リンクは現在のブラウジングコンテキストに展開される。 _top:リンクは現在のブラウジングコンテキストの最上位のブラウジングコンテキスを対象に展開される。 ブラウジングコンテキスト名(任意のブラウジング・コンテキストに表示) | リンクアンカーの表示先を指定する。 |
hreflang(ハイバー・リファレンス・ランゲージ) | リンク先の記述言語 | jaやenなど |
ping | リンクの送信先をURLで指定 | pingの送信先(半角スペースで複数指定できる)。 |
referrerpolicy(リファラーポリシー) | referrerpolicy 属性に指定できる値については、下のreferrerpolicy 属性に指定できる値を参照ください。 | referrerpolicy 属性は、リンク先にアクセスする際、あるいは画像など外部リソースをリクエストする際にリファラ(アクセス元の URL 情報)を送信するか否か(リファラポリシー)を指定します。 |
referrerpolicy属性に指定できる値
属性値 | 説明 |
---|---|
空文字列 | デフォルト値。特にリファラに対して条件指定をせず、ブラウザの挙動による。 |
no-referrer | リファラを一切送信しません。a 要素や area 要素にrel="noreferrer" を付与した場合と同様の扱いとなる。 |
no-referrer-when-downgrade | リンク元が SSL/TLS を用いており、リンク先が SSL/TLS を用いていない場合(HTTPS→HTTP)にはリファラを送信しない。 |
same-origin | リンク元とリンク先が同一オリジンの場合は。リファラを送信する。 |
origin | リンク元のオリジンのみが送信される。 |
strict-origin | リンク元、リンク先がそれぞれ SSL/TLS を用いている場合、あるいはリンク元が SSL/TLS を用いていない場合にリンク元のオリジンのみを送信する。 |
origin-when-cross-origin | リンク元とリンク先が異なるオリジンの場合、リンク元のオリジンのみを送信する。 リンク元とリンク先が同一オリジンの場合、リンク元の完全な URL をリファラとして送信する。 |
strict-origin-when-cross-origin | リンク元、リンク先がそれぞれ SSL/TLS を用いている場合、あるいはリンク元が SSL/TLS を用いていない場合に下記の条件でリファラを送信する。 ・リンク元とリンク先が異なるオリジンの場合、リンク元のオリジンのみを送信します。 ・リンク元とリンク先が同一オリジンの場合、リンク元の完全な URL をリファラとして送信します。 |
unsafe-url | リンク元の完全な URL をリファラとして送信する。 |
使用例
<nav>
<ul>
<li>a href="">トップページ</a></li>
<li><a href="/company-profile">会社概要</a></li>
<li><a href="/access">アクセス</a></li>
<li><a href="/staff-introduction">スタッフ紹介</a></li>
<li><a>料金表</a></li>・・・ダミーリンク
</ul>
</nav>
表示
*リンクはダミーリンクになります。