link要素
の仕様

link
外部リソースにリンク (a media-independent link)
種類
空要素
カテゴリ
メタデータコンテンツ
itemprop属性がある場合、またはbody-okのキーワードのみを含む rel属性がある場合、その要素はbodyで許可されているといい、この要素は、フレージングコンテンツ, フローコンテンツ でもあります。
レンダ
リング
ボックスを生成しない
非表示の要素
  1. link {
  2. display: none;
  3. }

CSS を大雑把に読むと、 要素とその子孫は、ボックスやテキストランを生成しません。 などになります。

使用できる状態
メタデータコンテンツを受け入れる要素。
head要素の子である noscript要素。
要素がbodyで許可されている場合は、フレージングコンテンツを受け入れる要素。
許可されている内容
なし
タグの省略
省略できません。
許可されているARIA
なし[No corresponding role]
属性

グローバル属性

href
ハイパーリンクのアドレス
crossorigin
要素がクロスオリジンリクエストを処理する方法
rel
ハイパーリンクを含むドキュメントと宛先リソースの関係
media
該当するメディア
integrity
サブリソース整合性チェックで使用される整合性メタデータ[SRI]
hreflang
リンクされたリソースの言語
type
参照されるリソースのタイプのヒント
referrerpolicy
要素によって開始されたフェッチのリファラーポリシー
sizes
アイコンのサイズ(rel ='icon'の場合)
imagesrcset
高解像度ディスプレイ、小型モニターなど、さまざまな状況で使用する画像(rel ='preload'の場合)
imagesizes
さまざまなページレイアウトの画像サイズ(rel ='preload'の場合)
as
プリロード要求の潜在的な宛先(rel ='preload'およびrel='modulepreload'の場合)
blocking
要素が潜在的にレンダリングをブロックしているかどうか(rel='modulepreload'およびrel='preload'およびrel='stylesheet'の場合)
color
サイトのアイコンをカスタマイズするときに使用する色(rel ='mask-icon'の場合)
disabled
リンクが無効になっているかどうか
title
この要素に特別なセマンティクスで、リンクのタイトル, CSSスタイルシートセット名。
DOM
HTMLLinkElement
  1. [Exposed=Window]
  2. interface HTMLLinkElement : HTMLElement {
  3. [HTMLConstructor] constructor();
  4.  
  5. [CEReactions] attribute USVString href;
  6. [CEReactions] attribute DOMString? crossOrigin;
  7. [CEReactions] attribute DOMString rel;
  8. [CEReactions] attribute DOMString as;
  9. [SameObject, PutForwards=value] readonly attribute DOMTokenList relList;
  10. [CEReactions] attribute DOMString media;
  11. [CEReactions] attribute DOMString integrity;
  12. [CEReactions] attribute DOMString hreflang;
  13. [CEReactions] attribute DOMString type;
  14. [SameObject, PutForwards=value] readonly attribute DOMTokenList sizes;
  15. [CEReactions] attribute USVString imageSrcset;
  16. [CEReactions] attribute DOMString imageSizes;
  17. [CEReactions] attribute DOMString referrerPolicy;
  18. [SameObject, PutForwards=value] readonly attribute DOMTokenList blocking;
  19. [CEReactions] attribute boolean disabled;
  20.  
  21. // also has obsolete members
  22. [CEReactions] attribute DOMString charset;
  23. [CEReactions] attribute DOMString rev;
  24. [CEReactions] attribute DOMString target;
  25. };
PUG
_template.pug
  1. block variable
  2. block document
  3. doctype html
  4. html(lang="ja")
  5. head
  6. block head
  7. meta(charset="UTF-8")
  8. title 離珠のHTMLでしぃ！
  9. link(rel="stylesheet" href="./risyu01.css")
  10. noscript
  11. link(rel="stylesheet" href="./noscript.css")
  12. body
  13. block body
  14. | link要素のサンプル用ページです。
  15. link(rel="stylesheet" href="./risyu02.css")
説明
link要素は、現在の文書と外部のリソースとの関係を表します。

link要素を使用すると、作成者はドキュメントを他のリソースにリンクできます。

「link要素」のページで改めて詳細に記述しています。

  1. <!DOCTYPE html>
  2. <html lang="ja">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>離珠のHTMLでしぃ！</title>
  6. <link rel="stylesheet" href="./risyu01.css">
  7. <noscript>
  8. <link rel="stylesheet" href="./noscript.css">
  9. </noscript>
  10. </head>
  11. <body>
  12. link要素のサンプル用ページです。
  13. <link rel="stylesheet" href="./risyu02.css">
  14. </body>
  15. </html>
参照元
参照元
  1. HTML Living Standard. 4.2.4 The link element
  2. HTML Living Standard. 4.6.6 Link types
  3. HTML Living Standard. 15 Rendering 15.3.1 Hidden elements
  4. HTML 5.2 W3C 勧告. 4.2.4. The link element (W3C勧告、2017年12月14日)
  5. HTML 5.2 W3C 勧告. 10.3.1. Hidden elements (W3C勧告、2017年12月14日)
  6. HTML 5.1 W3C 勧告. 4.2.4. The link element (W3C勧告、2016年11月1日)
  7. HTML 5.1 W3C 勧告. 10.3.1. Hidden elements (W3C勧告、2016年11月1日)
  8. HTML 4.01 Specification W3C 勧告. 12.3 Document relationships: the LINK element (W3C勧告1999年12月24日)
  9. HTML 3.2 Reference Specification. LINK (W3C勧告1997年1月14日)
  10. Hypertext Markup Language - 2.0 (November 1995)
  11. Hypertext Markup Language (HTML) (June 1993)
  12. MDN Web Docs. HTML <link>: 外部リソースへのリンク要素
最終確認日
2022-07-27