Living Standard — Last Updated 6 December 2024
html
elementSupport in all current engines.
Support in all current engines.
head
要素の後に続いてbody
要素。html
要素内の最初の文がコメントでない場合、html
要素の開始タグは省略することができる。html
要素の直後がコメントでない場合、html
要素の終了タグは省略することができる。[Exposed =Window ]
interface HTMLHtmlElement : HTMLElement {
[HTMLConstructor ] constructor ();
// also has obsolete members
};
著者は、文書の言語を与えるために、ルートのhtml
要素にlang
属性を指定することが推奨される。これは、音声合成ツールにどの発音を使用するかを決定する、翻訳ツールを使用するための規則を決定する、などの手助けを行う。
次の例において、html
要素は、文書言語が英語であることを宣言する。
<!DOCTYPE html>
< html lang = "en" >
< head >
< title > Swapping Songs</ title >
</ head >
< body >
< h1 > Swapping Songs</ h1 >
< p > Tonight I swapped some of the songs I wrote with some friends, who
gave me some of the songs they wrote. I love sharing my music.</ p >
</ body >
</ html >
head
elementSupport in all current engines.
Support in all current engines.
html
要素での最初の要素として。iframe
srcdoc
文書であるか、タイトル情報がより上位プロトコルから利用可能な場合、1つより多くないtitle
要素および1つより多くないbase
要素である、0個以上のメタデータコンテンツ。title
要素が存在しかつ1つより多くないbase
要素である、1つ以上のメタデータコンテンツ。head
要素内の最初の文が要素である場合、head
要素の開始タグは省略することができる。head
要素の直前がASCII空白文字またはコメントでない場合、head
要素の終了タグは省略することができる。[Exposed =Window ]
interface HTMLHeadElement : HTMLElement {
[HTMLConstructor ] constructor ();
};
head
要素は、Document
に関するメタデータの集まりを表す。
head
要素でのメタデータの集まりは、大きいかもしれないし、小さいかもしれない。これは非常に簡潔な例である:
<!doctype html>
< html lang = en >
< head >
< title > A document with a short head</ title >
</ head >
< body >
...
これはより大きな例である:
<!DOCTYPE HTML>
< HTML LANG = "EN" >
< HEAD >
< META CHARSET = "UTF-8" >
< BASE HREF = "https://www.example.com/" >
< TITLE > An application with a long head</ TITLE >
< LINK REL = "STYLESHEET" HREF = "default.css" >
< LINK REL = "STYLESHEET ALTERNATE" HREF = "big.css" TITLE = "Big Text" >
< SCRIPT SRC = "support.js" ></ SCRIPT >
< META NAME = "APPLICATION-NAME" CONTENT = "Long headed application" >
</ HEAD >
< BODY >
...
The title
element is a required child in most situations, but when a higher-level protocol provides title information, e.g., in the subject line of an email when HTML is used as an email authoring format, the title
element can be omitted.
title
elementSupport in all current engines.
Support in all current engines.
title
要素を含まないhead
要素内。[Exposed =Window ]
interface HTMLTitleElement : HTMLElement {
[HTMLConstructor ] constructor ();
[CEReactions ] attribute DOMString text ;
};
title
要素は、文書のタイトルまたは名前を表す。たとえば、ユーザーの履歴やブックマークまたは検索結果などで、文脈を無視して使用される場合でも、著者は文書を識別するタイトルを使用すべきである。文脈から取り出したときに最初の見出しが独立する必要はないので、文書のタイトルは多くの場合、最初の見出しとは異なる。
文書ごとに複数のtitle
要素が存在してはならない。
タイトルがないことが合理的なDocument
の場合、title
要素はおそらく必要とされない。この要素が必要とされる場合の説明については、head
要素のコンテンツモデルを参照のこと。
title.text [ = value ]
要素の子テキストコンテンツを返す。
与えられた値を持つ要素の子を置換するために、設定できる。
The text
attribute's getter must return this title
element's child text content.
The text
attribute's setter must string replace all with the given value within this title
element.
それらの同じページ上で使用されるかもしれないトップレベルの見出しと対照的に、適切なタイトルのいくつかの例を次に示す。
< title > Introduction to The Mating Rituals of Bees</ title >
...
< h1 > Introduction</ h1 >
< p > This companion guide to the highly successful
< cite > Introduction to Medieval Bee-Keeping</ cite > book is...
次のページは、同じサイトの一部であるかもしれない。最初の見出しが、読者がどのような文脈か知っており、したがってダンスがサルサやワルツであるかどうかを知りたいと思わないだろうことを前提としつつ、タイトルが明確に主題を説明する方法に注意する:
< title > Dances used during bee mating rituals</ title >
...
< h1 > The Dances</ h1 >
文書のタイトルとして使用する文字列は、document.title
IDL属性によって与えられる。
ユーザーインターフェイスで文書を参照する際に、ユーザーエージェントは、文書のタイトルを使用すべきである。title
要素のコンテンツがこの方法で使用される場合、そのtitle
要素の書字方向は、ユーザーインターフェイスにおける文書のタイトルの書字方向を設定するために使用されるべきである。
base
elementSupport in all current engines.
Support in all current engines.
base
要素を含まないhead
要素内。href
— 文書基底URLtarget
— Default navigable for hyperlink navigation and form submission[Exposed =Window ]
interface HTMLBaseElement : HTMLElement {
[HTMLConstructor ] constructor ();
[CEReactions ] attribute USVString href ;
[CEReactions ] attribute DOMString target ;
};
The base
element allows authors to specify the document base URL for the purposes of parsing URLs, and the name of the default navigable for the purposes of following hyperlinks. この要素は、この情報を超えた任意のコンテンツを表すものでない。
文書ごとに複数のbase
要素が存在してはならない。
base
要素は、href
属性、またはtarget
属性のいずれか、あるいはその両方を持たなければならない。
href
コンテンツ属性が指定される場合、潜在的にスペースで囲まれた妥当なURLでなければならない。
href
属性を持つ場合、base
要素は、html
要素を除いて(manifest
属性はbase
要素に影響されない)、URLを取得するよう定義された属性を持つツリー内の他の要素の前に来なければならない。
href
属性をもつ複数のbase
が存在する場合、最初のものを除いてすべて無視される。
The target
attribute, if specified, must contain a valid navigable target name or keyword, which specifies which navigable is to be used as the default when hyperlinks and forms in the Document
cause navigation.
target
属性を持つ場合、base
要素は、ハイパーリンクを表すツリー内の要素の前に来なければならない。
target
属性をもつ複数のbase
が存在する場合、最初のものを除いてすべて無視される。
To get an element's target, given an a
, area
, or form
element element, and an optional string-or-null target (default null), run these steps:
If target is null, then:
If element has a target
attribute, then set target to that attribute's value.
Otherwise, if element's node document contains a base
element with a target
attribute, set target to the value of the target
attribute of the first such base
element.
If target is not null, and contains an ASCII tab or newline and a U+003C (<), then set target to "_blank
".
Return target.
A base
element that is the first base
element with an href
content attribute in a document tree has a frozen base URL. The frozen base URL must be immediately set for an element whenever any of the following situations occur:
The base
element becomes the first base
element in tree order with an href
content attribute in its Document
.
The base
element is the first base
element in tree order with an href
content attribute in its Document
, and its href
content attribute is changed.
To set the frozen base URL for an element element:
Let document be element's node document.
Let urlRecord be the result of parsing the value of element's href
content attribute with document's fallback base URL, and document's character encoding. (Thus, the base
element isn't affected by itself.)
If any of the following are true:
urlRecord is failure;
urlRecord's scheme is "data
" or "javascript
"; or
running Is base allowed for Document? on urlRecord and document returns "Blocked
",
then set element's frozen base URL to document's fallback base URL and return.
Set element's frozen base URL to urlRecord.
The href
IDL attribute, on getting, must return the result of running the following algorithm:
Let document be element's node document.
Let url be the value of the href
attribute of this element, if it has one, and the empty string otherwise.
Let urlRecord be the result of parsing url with document's fallback base URL, and document's character encoding. (Thus, the base
element isn't affected by other base
elements or itself.)
If urlRecord is failure, return url.
Return the serialization of urlRecord.
The href
IDL attribute, on setting, must set the href
content attribute to the given new value.
The target
IDL attribute must reflect the content attribute of the same name.
この例において、base
要素は文書の基底URLを設定するために使用される:
<!DOCTYPE html>
< html lang = "en" >
< head >
< title > This is an example for the < base> element</ title >
< base href = "https://www.example.com/news/index.html" >
</ head >
< body >
< p > Visit the < a href = "archives.html" > archives</ a > .</ p >
</ body >
</ html >
上記の例において、リンクは"http://www.example.com/news/archives.html
"へのリンクとなる。
link
elementSupport in all current engines.
Support in all current engines.
head
の子であるnoscript
要素内。href
— ハイパーリンクのアドレスcrossorigin
— 要素がcrossorigin要求を処理する方法rel
— ハイパーリンクと宛先のリソースを含む文書の関係media
— 受け入れ可能なメディアintegrity
— Subresource Integrityチェックで使用される整合性メタデータ[SRI]hreflang
— リンクされたリソースの言語type
— 参照されるリソースタイプのヒントreferrerpolicy
— 要素によって開始されたフェッチのためのリファラポリシーsizes
— アイコンのサイズ(rel
="icon
"に対する)imagesrcset
— Images to use in different situations, e.g., high-resolution displays, small monitors, etc. (for rel
="preload
")imagesizes
— Image sizes for different page layouts (for rel
="preload
")as
— プリロードリクエストの潜在的な宛先(rel
="preload
"およびrel
="modulepreload
"に対して)blocking
— Whether the element is potentially render-blockingcolor
— サイトのアイコンをカスタマイズする際に使用する色(rel
="mask-icon
"に対して)disabled
— Whether the link is disabledfetchpriority
— Sets the priority for fetches initiated by the elementtitle
attribute has special semantics on this element: Title of the link; CSS style sheet set name[Exposed =Window ]
interface HTMLLinkElement : HTMLElement {
[HTMLConstructor ] constructor ();
[CEReactions ] attribute USVString href ;
[CEReactions ] attribute DOMString ? crossOrigin ;
[CEReactions ] attribute DOMString rel ;
[CEReactions ] attribute DOMString as ;
[SameObject , PutForwards =value ] readonly attribute DOMTokenList relList ;
[CEReactions ] attribute DOMString media ;
[CEReactions ] attribute DOMString integrity ;
[CEReactions ] attribute DOMString hreflang ;
[CEReactions ] attribute DOMString type ;
[SameObject , PutForwards =value ] readonly attribute DOMTokenList sizes ;
[CEReactions ] attribute USVString imageSrcset ;
[CEReactions ] attribute DOMString imageSizes ;
[CEReactions ] attribute DOMString referrerPolicy ;
[SameObject , PutForwards =value ] readonly attribute DOMTokenList blocking ;
[CEReactions ] attribute boolean disabled ;
[CEReactions ] attribute DOMString fetchPriority ;
// also has obsolete members
};
HTMLLinkElement includes LinkStyle ;
link
要素は、著者が文書を他のリソースとリンクするのを可能にする。
The address of the link(s) is given by the href
attribute. If the href
attribute is present, then its value must be a valid non-empty URL potentially surrounded by spaces. One or both of the href
or imagesrcset
attributes must be present.
If both the href
and imagesrcset
attributes are absent, then the element does not define a link.
(関係を)示されるリンクの種類はrel
属性値によって与えられ、存在する場合、順不同のスペースで区切られたトークンの集合である値を持たなければならない。許可されたキーワードとその意味は、後の節で定義される。rel
属性が不在である、キーワードを持たない、または使用されるキーワードのいずれもこの仕様における定義に従って許可されない場合、その要素は一切のリンクを作成しない。
rel
のサポートされるトークンは、link
要素で許可されるHTMLリンクタイプで定義されるキーワードであり、処理モデルに影響を与え、ユーザーエージェントによってサポートされる。The possible supported tokens are alternate
, dns-prefetch
, expect
, icon
, manifest
, modulepreload
, next
, pingback
, preconnect
, prefetch
, preload
, search
, and stylesheet
. rel
's supported tokens must only include the tokens from this list that the user agent implements the processing model for.
Theoretically a user agent could support the processing model for the canonical
keyword — if it were a search engine that executed JavaScript. But in practice that's quite unlikely. So in most cases, canonical
ought not be included in rel
's supported tokens.
link
要素はrel
属性またはitemprop
属性を持たなければならないが、同時に持ってはならない。
link
要素がitemprop
属性を持つ、またはbody-okであるキーワードのみを含むrel
属性を持つ場合、要素はbody内で許可されると呼ばれる。これは、要素がフレージングコンテンツが期待される場所で使用できることを意味する。
rel
属性が使用される場合、この要素はページのbody
内でのみ使用することができる。itemprop
属性とともに使用される場合、マイクロデータモデルの制限と仮定して、要素はhead
要素またはページのbody
要素で使用できる。
Two categories of links can be created using the link
element: links to external resources and hyperlinks. リンクタイプの節では、あるリンクタイプが外部リソースまたはハイパーリンクであるかどうかを定義する。1つのlink
要素は、複数のリンク(一部は外部リソースリンクかもしれず、一部はハイパーリンクであるかもしれない)を作成できる。正確には、どのリンクがどれだけ作成されるかは、rel
属性で与えられるキーワードに応じて異なる。ユーザーエージェントは、要素あたりの基準ではなく、リンクあたりの基準でリンクを処理しなければならない。
link
要素に対して作成された各リンクは別々に処理される。たとえば、rel="stylesheet"
をもつ2つのlink
要素が存在する場合、これらは個別の外部リソースとして数え、およびそれぞれが独立に独自の属性によって影響される。同様に、単一のlink
要素が値next stylesheet
を伴うrel
属性を持つ場合、それはハイパーリンク(next
キーワードへの)および外部リソースリンク(stylesheet
キーワードへの)の両方を作成し、それらはそれぞれに(media
またはtitle
のような)他の属性の影響を受ける。
たとえば、次のlink
要素は、(同じページへの)2つのハイパーリンクを作成する。
< link rel = "author license" href = "/about" >
この要素によって作成される2つのリンクは、1つは対象ページが現在のページの著者に関する情報を持つセマンティックであり、1つは現在のページが提供されている内部でライセンスに関する情報を対象ページが持つセマンティックである。
link
要素とrel
属性で作成されるハイパーリンクは、文書全体に適用される。これは、コンテキストが文書内のリンク位置によって与えられるリンク型を示す、a
およびarea
要素のrel
属性とは対照的である。
Unlike those created by a
and area
elements, hyperlinks created by link
elements are not displayed as part of the document by default, in user agents that support the suggested default rendering. And even if they are force-displayed using CSS, they have no activation behavior. Instead, they primarily provide semantic information which might be used by the page or by other software that consumes the page's contents. Additionally, the user agent can provide its own UI for following such hyperlinks.
外部リソースへのリンクに対する正確な振る舞いは、関連するリンク型に対して定義されるように、正確な関係に依存する。
crossorigin
属性はCORS設定属性である。これは、外部リソースリンクでの使用を意図される。
media
属性は、リソースが適用されるメディアを表す。値は妥当なメディアクエリーリストでなければならない。
Support in all current engines.
integrity
属性は、この要素が責任を負うリクエストに対する完全性メタデータを表す。値はテキストである。The attribute must only be specified on link
elements that have a rel
attribute that contains the stylesheet
, preload
, or modulepreload
keyword. [SRI]
link
要素のhreflang
属性は、a
要素のhreflang
属性と同じセマンティックスを持つ。
type
属性は、リンクされたリソースのMIMEタイプを提供する。これは単なる助言である。値は妥当なMIMEタイプ文字列でなければならない。
外部リソースへのリンクについて、それらがサポートしないリソースの再取得を回避できるように、type
属性はユーザーエージェントへのヒントとして使用される。
referrerpolicy
属性は、リファラポリシー属性である。属性がリンクされた外部リソースを取得して処理するときに使用されるリファラポリシーを設定するのを手伝う場合、この属性は外部リソースリンクとともに使用するためのものである。[REFERRERPOLICY]
title
属性は、リンクのタイトルを与える。一つの例外を除いて、これは純粋に助言的である。値はテキストである。例外は、title
属性がCSSスタイルシートセットを定義する、文書ツリー内であるスタイルシートリンクである。
link
要素のtitle
属性は、タイトルをもたないリンクが親要素のタイトルを継承しない点で、他のほとんどの要素に属するグローバルtitle
属性とは異なる。それは単にタイトルを持たない。
The imagesrcset
attribute may be present, and is a srcset attribute.
The imagesrcset
and href
attributes (if width descriptors are not used) together contribute the image sources to the source set.
If the imagesrcset
attribute is present and has any image candidate strings using a width descriptor, the imagesizes
attribute must also be present, and is a sizes attribute. The imagesizes
attribute contributes the source size to the source set.
The imagesrcset
and imagesizes
attributes must only be specified on link
elements that have both a rel
attribute that specifies the preload
keyword, as well as an as
attribute in the "image
" state.
These attributes allow preloading the appropriate resource that is later used by an img
element that has the corresponding values for its srcset
and sizes
attributes:
< link rel = "preload" as = "image"
imagesrcset = "wolf_400px.jpg 400w, wolf_800px.jpg 800w, wolf_1600px.jpg 1600w"
imagesizes = "50vw" >
<!-- ... later, or perhaps inserted dynamically ... -->
< img src = "wolf.jpg" alt = "A rad wolf"
srcset = "wolf_400px.jpg 400w, wolf_800px.jpg 800w, wolf_1600px.jpg 1600w"
sizes = "50vw" >
Note how we omit the href
attribute, as it would only be relevant for browsers that do not support imagesrcset
, and in those cases it would likely cause the incorrect image to be preloaded.
The imagesrcset
attribute can be combined with the media
attribute to preload the appropriate resource selected from a picture
element's sources, for art direction:
< link rel = "preload" as = "image"
imagesrcset = "dog-cropped-1x.jpg, dog-cropped-2x.jpg 2x"
media = "(max-width: 800px)" >
< link rel = "preload" as = "image"
imagesrcset = "dog-wide-1x.jpg, dog-wide-2x.jpg 2x"
media = "(min-width: 801px)" >
<!-- ... later, or perhaps inserted dynamically ... -->
< picture >
< source srcset = "dog-cropped-1x.jpg, dog-cropped-2x.jpg 2x"
media = "(max-width: 800px)" >
< img src = "dog-wide-1x.jpg" srcset = "dog-wide-2x.jpg 2x"
alt = "An awesome dog" >
</ picture >
sizes
属性は、視覚形式のアイコンのサイズを与える。存在する場合、この値は単に助言を与えるだけである。複数のアイコンが利用可能な場合、ユーザーエージェントは、どのアイコンを使用するかを決定するためにこの値を使用してもよい。存在する場合、この属性は、ASCII大文字・小文字不区別である一意なスペース区切りトークンの順不同の組である値を持たなければならない。値はそれぞれ、"any
"に一致するASCII大文字・小文字不区別である文字列か、2つの妥当な非負整数からなる値のいずれかでなければならない。この数値は、先行するU+0030 DIGIT ZERO(0)文字を持たず、かつ1つのU+0078 LATIN SMALL LETTER XまたはU+0058 LATIN CAPITAL LETTER X文字により分離される。The attribute must only be specified on link
elements that have a rel
attribute that specifies the icon
keyword or the apple-touch-icon
keyword.
apple-touch-icon
キーワードは、登録された事前定義されたリンクタイプのセットへの拡張であるが、ユーザーエージェントは形はどうあれそのキーワードをサポートする必要はない。
as
属性は、href
属性によって与えられるリソースに対するプリロードリクエストの潜在的な宛先を指定する。この属性は列挙属性である。各潜在的な宛先は、同じ名前の状態にマッピングする、この属性のキーワードである。属性は、preload
キーワードを含むrel
属性を持つlink
要素で指定されなければならない。これは、modulepreload
キーワードを含むrel
属性を持つlink
要素で指定されてもよい。そのような場合には、script-like destinationである値を持たなければならない。他のlink
要素については、それを指定してはならない。
The processing model for how the as
attribute is used is given in an individual link type's fetch and process the linked resource algorithm.
属性は、欠損値のデフォルトまたは無効値のデフォルトを持たない。これは、属性の無効または欠損値が状態なしに対応することを意味する。これは処理モデルで説明される。preload
の場合、両方の条件はエラーである。modulepreload
リンクの場合、欠損値は"script
"として扱われる。
The blocking
attribute is a blocking attribute. It is used by link types stylesheet
and expect
, and it must only be specified on link elements that have a rel
attribute containing those keywords.
color
属性は、mask-icon
リンクタイプとともに使用される。The attribute must only be specified on link
elements that have a rel
attribute that contains the mask-icon
keyword. この値は、ユーザーエージェントがサイトをピン留めするときに目に付くアイコンの表示をカスタマイズするために使用することができる推奨色を定義する、CSS <color>生成物と一致する文字列でなければならない。
この仕様は、color
属性に対するユーザエージェント要件を一切持たない。
mask-icon
キーワードは、登録された事前定義されたリンクタイプのセットへの拡張であるが、ユーザーエージェントは形はどうあれそのキーワードをサポートする必要はない。
link
elements have an associated explicitly enabled boolean. 最初はfalseである。
The disabled
attribute is a boolean attribute that is used with the stylesheet
link type. The attribute must only be specified on link
elements that have a rel
attribute that contains the stylesheet
keyword.
Whenever the disabled
attribute is removed, set the link
element's explicitly enabled attribute to true.
Removing the disabled
attribute dynamically, e.g., using document.querySelector("link").removeAttribute("disabled")
, will fetch and apply the style sheet:
< link disabled rel = "alternate stylesheet" href = "css/pooh" >
The fetchpriority
attribute is a fetch priority attribute that is intended for use with external resource links, where it is used to set the priority used when fetching and processing the linked resource.
Support in all current engines.
The IDL attributes href
, hreflang
, integrity
, media
, rel
, sizes
, type
, blocking
, and disabled
each must reflect the respective content attributes of the same name.
There is no reflecting IDL attribute for the color
attribute, but this might be added later.
Support in all current engines.
The as
IDL attribute must reflect the as
content attribute, limited to only known values.
The crossOrigin
IDL attribute must reflect the crossorigin
content attribute, limited to only known values.
HTMLLinkElement/referrerPolicy
Support in all current engines.
The referrerPolicy
IDL attribute must reflect the referrerpolicy
content attribute, limited to only known values.
The fetchPriority
IDL attribute must reflect the fetchpriority
content attribute, limited to only known values.
The imageSrcset
IDL attribute must reflect the imagesrcset
content attribute.
The imageSizes
IDL attribute must reflect the imagesizes
content attribute.
Support in all current engines.
The relList
IDL attribute must reflect the rel
content attribute.
The relList
attribute can be used for feature detection, by calling its supports()
method to check which types of links are supported.
media
attributeリンクがハイパーリンクである場合、media
属性は純粋に助言であり、問題の文書が設計されたメディアに対して説明する。
しかし、リンクが外部リソースのリンクである場合、media
属性は規範的である。media
属性の値が環境にマッチしかつその他の条件が適用される場合、ユーザーエージェントは外部リソースを適用しなければならず、そうでなければ適用してはならない。
media
属性が省略される場合、デフォルトでは"all
"であり、デフォルトのリンクにより、すべてのメディアに適用されることを意味する。
外部リソースは、外部リソースの制限の適用内で定義される追加の制限があるかもしれない。たとえば、CSSスタイルシートは、いくつかの@mediaブロック
を持っているかもしれない。この仕様は、そのような追加の制限や要件を上書きしない。
type
attributeIf the type
attribute is present, then the user agent must assume that the resource is of the given type (even if that is not a valid MIME type string, e.g. the empty string). If the attribute is omitted, but the external resource link type has a default type defined, then the user agent must assume that the resource is of that type. If the UA does not support the given MIME type for the given link relationship, then the UA should not fetch and process the linked resource; if the UA does support the given MIME type for the given link relationship, then the UA should fetch and process the linked resource at the appropriate time as specified for the external resource link's particular type. If the attribute is omitted, and the external resource link type does not have a default type defined, but the user agent would fetch and process the linked resource if the type was known and supported, then the user agent should fetch and process the linked resource under the assumption that it will be supported.
ユーザーエージェントは、type
属性を信頼できるものとし考慮してはならない―リソースを取得する際に、ユーザーエージェントは、その実際のタイプを決定するためにtype
属性を使用してはならない。実際のタイプのみが、上記の想定タイプではなく、(次の段落で定義されるように)リソースを適用するかどうかを決定するために使用される。
If the external resource link type defines rules for processing the resource's Content-Type metadata, then those rules apply. Otherwise, if the resource is expected to be an image, user agents may apply the image sniffing rules, with the official type being the type determined from the resource's Content-Type metadata, and use the resulting computed type of the resource as if it was the actual type. Otherwise, if neither of these conditions apply or if the user agent opts not to apply the image sniffing rules, then the user agent must use the resource's Content-Type metadata to determine the type of the resource. If there is no type metadata, but the external resource link type has a default type defined, then the user agent must assume that the resource is of that type.
stylesheet
リンクタイプは、リソースのContent-Typeメタデータを処理するための規則を定義する。
ユーザーエージェントがリソースのタイプを一度確立すると、タイプがサポートされるタイプでありかつその他の条件が適用される場合、ユーザーエージェントはリソースを適用しなければならず、そうでなければリソースを無視しなければならない。
文書が次のようにラベル付けされたスタイルシートのリンクを含む場合:
< link rel = "stylesheet" href = "A" type = "text/plain" >
< link rel = "stylesheet" href = "B" type = "text/css" >
< link rel = "stylesheet" href = "C" >
(text/plain
はCSSスタイルシートのためのMIMEタイプではないので)CSSスタイルシートのみをサポートする適合ユーザーエージェントは、BとCのファイルを取得し、Aファイルをスキップする。
ファイルBとCの場合、その後サーバーから返される実際のタイプをチェックする。text/css
として送信されるものに対して、スタイルを適用するが、text/plain
としてラベル付けされるものに対して、スタイルを適用しない。
2つのファイルのいずれかがContent-Typeメタデータなしで、またはContent-Type: "null"
のような構文的に誤ったタイプとともに返された場合、stylesheet
のリンクに対するデフォルトタイプは蹴られる。Since that default type is text/css
, the style sheet would nonetheless be applied.
link
elementAll external resource links have a fetch and process the linked resource algorithm, which takes a link
element el. They also have linked resource fetch setup steps which take a link
element el and request request. Individual link types may provide their own fetch and process the linked resource algorithm, but unless explicitly stated, they use the default fetch and process the linked resource algorithm. Similarly, individual link types may provide their own linked resource fetch setup steps, but unless explicitly stated, these steps just return true.
The default fetch and process the linked resource, given a link
element el, is as follows:
Let options be the result of creating link options from el.
Let request be the result of creating a link request given options.
If request is null, then return.
Set request's synchronous flag.
Run the linked resource fetch setup steps, given el and request. If the result is false, then return.
Set request's initiator type to "css
" if el's rel
attribute contains the keyword stylesheet
; "link
" otherwise.
Fetch request with processResponseConsumeBody set to the following steps given response response and null, failure, or a byte sequence bodyBytes:
Let success be true.
If any of the following are true:
then set success to false.
Note that content-specific errors, e.g., CSS parse errors or PNG decoding errors, do not affect success.
Otherwise, wait for the link resource's critical subresources to finish loading.
The specification that defines a link type's critical subresources (e.g., CSS) is expected to describe how these subresources are fetched and processed. However, since this is not currently explicit, this specification describes waiting for a link resource's critical subresources to be fetched and processed, with the expectation that this will be done correctly.
Process the linked resource given el, success, response, and bodyBytes.
To create a link request given a link processing options options:
If options's destination is null, then return null.
Let url be the result of encoding-parsing a URL given options's href, relative to options's base URL.
Passing the base URL instead of a document or environment is tracked by issue #9715.
If url is failure, then return null.
Let request be the result of creating a potential-CORS request given url, options's destination, and options's crossorigin.
Set request's policy container to options's policy container.
Set request's integrity metadata to options's integrity.
Set request's cryptographic nonce metadata to options's cryptographic nonce metadata.
Set request's referrer policy to options's referrer policy.
Set request's client to options's environment.
Set request's priority to options's fetch priority.
Return request.
User agents may opt to only try to fetch and process such resources when they are needed, instead of pro-actively fetching all the external resources that are not applied.
Similar to the fetch and process the linked resource algorithm, all external resource links have a process the linked resource algorithm which takes a link
element el, boolean success, a response response, and a byte sequence bodyBytes. Individual link types may provide their own process the linked resource algorithm, but unless explicitly stated, that algorithm does nothing.
Unless otherwise specified for a given rel
keyword, the element must delay the load event of the element's node document until all the attempts to fetch and process the linked resource and its critical subresources are complete. (Resources that the user agent has not yet attempted to fetch and process, e.g., because it is waiting for the resource to be needed, do not delay the load event.)
Link
` headersAll link types that can be external resource links define a process a link header algorithm, which takes a link processing options. This algorithm defines whether and how they react to appearing in an HTTP `Link
` response header.
For most link types, this algorithm does nothing. The summary table is a good reference to quickly know whether a link type has defined process a link header steps.
A link processing options is a struct. It has the following items:
link
")Document
Document
auto
)A link processing options has a base URL and an href rather than a parsed URL because the URL could be a result of the options's source set.
To create link options from element given a link
element el:
Let document be el's node document.
Let options be a new link processing options with
as
attribute.crossorigin
content attributereferrerpolicy
content attributefetchpriority
content attributeIf el has an href
attribute, then set options's href to the value of el's href
attribute.
If el has an integrity
attribute, then set options's integrity to the value of el's integrity
content attribute.
If el has a type
attribute, then set options's type to the value of el's type
attribute.
Assert: options's href is not the empty string, or options's source set is not null.
A link
element with neither an href
or an imagesrcset
does not represent a link.
Return options.
To extract links from headers given a header list headers:
Let links be a new list.
Let rawLinkHeaders be the result of getting, decoding, and splitting `Link
` from response's header list.
For each linkHeader of rawLinkHeaders:
Return links.
To process link headers given a Document
doc, a response response, and a "pre-media
" or "media
" phase:
Let links be the result of extracting links from response's header list.
For each linkObject in links:
Let rel be linkObject["relation_type
"].
Let attribs be linkObject["target_attributes
"].
Let expectedPhase be "media
" if either "srcset
", "imagesrcset
", or "media
" exist in attribs; otherwise "pre-media
".
If expectedPhase is not phase, then continue.
If attribs["media
"] exists and attribs["media
"] does not match the environment, then continue.
Let options be a new link processing options with
target_uri
"]Apply link options from parsed header attributes to options given attribs.
If attribs["imagesrcset
"] exists and attribs["imagesizes
"] exists, then set options's source set to the result of creating a source set given linkObject["target_uri
"], attribs["imagesrcset
"], attribs["imagesizes
"], and null.
Run the process a link header steps for rel given options.
To apply link options from parsed header attributes to a link processing options options given attribs:
If attribs["as
"] exists, then set options's destination to the result of translating attribs["as
"].
If attribs["crossorigin
"] exists and is an ASCII case-insensitive match for one of the CORS settings attribute keywords, then set options's crossorigin to the CORS settings attribute state corresponding to that keyword.
If attribs["integrity
"] exists, then set options's integrity to attribs["integrity
"].
If attribs["referrerpolicy
"] exists and is an ASCII case-insensitive match for some referrer policy, then set options's referrer policy to that referrer policy.
If attribs["nonce
"] exists, then set options's nonce to attribs["nonce
"].
If attribs["type
"] exists, then set options's type to attribs["type
"].
If attribs["fetchpriority
"] exists and is an ASCII case-insensitive match for a fetch priority attribute keyword, then set options's fetch priority to that fetch priority attribute keyword.
Early hints allow user-agents to perform some operations, such as to speculatively load resources that are likely to be used by the document, before the navigation request is fully handled by the server and a response code is served. Servers can indicate early hints by serving a response with a 103 status code before serving the final response.[RFC8297]
For compatibility reasons early hints are typically delivered over HTTP/2 or above, but for readability we use HTTP/1.1-style notation below.
For example, given the following sequence of responses:
103 Early Hint Link: </image.png>; rel=preload; as=image
200 OK Content-Type: text/html <!DOCTYPE html> ... <img src="/image.png">
the image will start loading before the HTML content arrives.
Only the first early hint response served during the navigation is handled, and it is discarded if it is succeeded by a cross-origin redirect.
In addition to the `Link
` headers, it is possible that the 103 response contains a Content Security Policy header, which is enforced when processing the early hint.
For example, given the following sequence of responses:
103 Early Hint Content-Security-Policy: style-src: self; Link: </style.css>; rel=preload; as=style
103 Early Hint Link: </image.png>; rel=preload; as=image
302 Redirect Location: /alternate.html
200 OK Content-Security-Policy: style-src: none; Link: </font.ttf>; rel=preload; as=font
The font and style would be loaded, and the image will be discarded, as only the first early hint response in the final redirect chain is respected. The late Content Security Policy header comes after the request to fetch the style has already been performed, but the style will not be accessible to the document.
To process early hint headers given a response response and an environment reservedEnvironment:
Early-hint `Link
` headers are always processed before `Link
` headers from the final response, followed by link
elements. This is equivalent to prepending the contents of the early and final `Link
` headers to the Document
's head
element, in respective order.
Let earlyPolicyContainer be the result of creating a policy container from a fetch response given response and reservedEnvironment.
This allows the early hint response to include a Content Security Policy which would be enforced when fetching the early hint request.
Let links be the result of extracting links from response's header list.
Let earlyHints be an empty list.
For each linkObject in links:
The moment we receive the early hint link header, we begin fetching earlyRequest. If it comes back before the Document
is created, we set earlyResponse to the response of that fetch and once the Document
is created we commit it (by making it available in the map of preloaded resources as if it was a link
element). If the Document
is created first, the response is committed as soon as it becomes available.
Let rel be linkObject["relation_type
"].
Let options be a new link processing options with
target_uri
"]early-hint
"Let attribs be linkObject["target_attributes
"].
Only the as
, crossorigin
, integrity
, and type
attributes are handled as part of early hint processing. The other ones, in particular blocking
, imagesrcset
, imagesizes
, and media
are only applicable once a Document
is created.
Apply link options from parsed header attributes to options given attribs.
Run the process a link header steps for rel given options.
Append options to earlyHints.
Return the following substeps given Document
doc: for each options in earlyHints:
If options's on document ready is null, then set options's document to doc.
Otherwise, call options's on document ready with doc.
link
elementインタラクティブなユーザーエージェントは、ユーザーインターフェイス内のどこかで、link
要素を使用して作成されるハイパーリンクを追跡する手段をユーザーに提供してもよい。Such invocations of the follow the hyperlink algorithm must set the userInvolvement argument to "browser UI
". The exact interface is not defined by this specification, but it could include the following information (obtained from the element's attributes, again as defined below), in some form or another (possibly simplified), for each hyperlink created with each link
element in the document:
rel
属性で与えられる)title
属性で与えられる)。href
属性で与えられる)。hreflang
属性で与えられる)。media
属性で与えられる)。ユーザーエージェントはまた、(type
属性によって与えられるような)リソースのタイプなどの情報を含めることができる。
meta
elementSupport in all current engines.
Support in all current engines.
itemprop
属性が存在する場合:フローコンテンツ。itemprop
属性が存在しない場合:フレージングコンテンツ。charset
属性が存在する場合、または要素のhttp-equiv
の属性がエンコード宣言状態にある場合:head
要素内。http-equiv
属性が存在するが、エンコード宣言状態でない場合:head
要素内。http-equiv
属性が存在するが、エンコード宣言状態でない場合:head
要素の子であるnoscript
要素内。name
属性が存在する場合:メタデータコンテンツが期待される場所。itemprop
属性が存在する場合:メタデータコンテンツが期待される場所。itemprop
属性が存在する場合:フレージングコンテンツが期待される場所。name
— メタデータ名http-equiv
— プラグマディレクティブcontent
— 要素の値charset
— 文字エンコーディング宣言media
— 受け入れ可能なメディア[Exposed =Window ]
interface HTMLMetaElement : HTMLElement {
[HTMLConstructor ] constructor ();
[CEReactions ] attribute DOMString name ;
[CEReactions ] attribute DOMString httpEquiv ;
[CEReactions ] attribute DOMString content ;
[CEReactions ] attribute DOMString media ;
// also has obsolete members
};
meta
要素は、title
、base
、link
、style
、script
要素を用いて表現できない様々な種類のメタデータを表す。
meta
要素は、name
属性をもつ文書レベルのメタデータ、http-equiv
属性を持つプラグマ・ディレクティブ、およびcharset
属性をもつHTML文書が文字列形式にシリアライズされる(たとえば、ネットワーク上の伝送、またはディスクストレージ)場合、ファイルの文字エンコーディング宣言を表すことができる。
name
、http-equiv
、charset
、およびitemprop
属性のうちの1つを正確に指定しなければならない。
name
、http-equiv
またはitemprop
のいずれかが指定される場合、content
属性も指定しなければならない。そうでなければ、省略されなければならない。
charset
属性は、文書で使用される文字エンコーディングを指定する。これは、文字エンコーディング宣言である。属性が存在する場合、その値は"utf-8
"にマッチするASCII大文字・小文字不区別でなければならない。
meta
要素上のcharset
属性は、XML文書では効果はないが、XMLからおよびへの移行を容易にするためにXML文書で許可される。
文書ごとにcharset
属性をもつ複数のmeta
要素があってはならない。
content
属性は、文書のメタデータまたは要素がそれらの目的のために使用される場合のプラグマディレクティブの値を与える。この仕様の後続の節で説明されるように、許可される値は、正確な文脈に依存する。
meta
要素がname
属性を持つ場合、文書のメタデータを設定する。文書のメタデータは、名前と値のペアの観点から表される。meta
要素のname
属性が名前を与え、同じ要素のcontent
属性が値を与える。名前はメタデータのどの側面を設定するかを指定する。妥当な名前とその値の意味は、次の節で説明する。meta
要素がcontent
属性を持たない場合、メタデータの名前と値のペアの値部分は、空文字列である。
The media
attribute says which media the metadata applies to. 値は妥当なメディアクエリーリストでなければならない。Unless the name
is theme-color
, the media
attribute has no effect on the processing model and must not be used by authors.
The name
, content
, and media
IDL attributes must reflect the respective content attributes of the same name. The IDL attribute httpEquiv
must reflect the content attribute http-equiv
.
Support in all current engines.
名前は大文字・小文字を区別せず、かつASCII大文字・小文字を区別しない方法で比較されなければならない。
application-name
The value must be a short free-form string giving the name of the web application that the page represents. If the page is not a web application, the application-name
metadata name must not be used. Translations of the web application's name may be given, using the lang
attribute to specify the language of each name.
与えられる言語をもつ複数のmeta
要素が存在してはならず、かつname
属性値が文書ごとに値application-name
とASCII大文字・小文字不区別で一致する。
タイトルはステータスメッセージを含むかもしれず、アプリケーションの名前であること代わりに特定の時点でページの状態に関連かもしれないので、ユーザーエージェントは、ページのtitle
に優先してUIでアプリケーション名を使用してもよい。
指定された言語の順序付きリスト(たとえばイギリス英語、アメリカ英語、英語)を使用するためにアプリケーション名を検索するには、ユーザーエージェントは次の手順を実行しなければならない:
languagesを言語のリストにする。
default languageが存在する場合、かつそれがlanguagesにおける言語のいずれかと同じ言語でない場合、languagesに追加する。
Let winning language be the first language in languages for which there is a meta
element in the Document
where the name
attribute value is an ASCII case-insensitive match for application-name
and whose language is the language in question.
If none of the languages have such a meta
element, then return; there's no given application name.
Return the value of the content
attribute of the first meta
element in the Document
in tree order where the name
attribute value is an ASCII case-insensitive match for application-name
and whose language is winning language.
このアルゴリズムは、例えばブックマークを標識するために、ブラウザーがページの名前を必要とする場合にブラウザーによって使用される。アルゴリズムに提供する言語は、ユーザーの優先言語になる。
author
値は、ページ著者のうちの一人の名前を与える、自由形式の文字列でなければならない。
description
値は、ページを説明する自由形式の文字列でなければならない。たとえば検索エンジン内など、値はページのディレクトリで使用するために適切なものでなければならない。name
属性値が文書ごとのdescription
にASCII大文字・小文字不区別マッチである場合、複数のmeta
要素が存在してはならない。
generator
値は、文書を生成するために使用されるソフトウェアパッケージの1つを識別する自由形式の文字列でなければならない。この値は、たとえばマークアップがテキストエディターでユーザーによって記述されたページのように、マークアップがソフトウェアによって生成されないページで使用してはならない。
"Frontweaver"と呼ばれるツールは、ページ生成のために使用されるツールとして自分自身を識別するために、ページのhead
要素内にその出力で含むかもしれない:
< meta name = generator content = "Frontweaver 8.2" >
keywords
値は、それぞれがページに関連するキーワードである、コンマ区切りトークンの集合でなければならない。
イギリスの高速道路上の書体に関するこのページは、ユーザーがページを検索するために使用するかもしれないキーワードを指定するmeta
要素を使用している:
<!DOCTYPE HTML>
< html lang = "en-GB" >
< head >
< title > Typefaces on UK motorways</ title >
< meta name = "keywords" content = "british,type face,font,fonts,highway,highways" >
</ head >
< body >
...
多くの検索エンジンは、この機能が歴史的に当てにならず、さらにはユーザーにとって有益でない手段をもたらす、検索エンジンスパムとして誤解を招く方法で使用されているので、そのようなキーワードを考慮しない。
著者がページに適用可能として指定しているキーワードのリストを取得するために、ユーザーエージェントは、次の手順を実行しなければならない:
keywordsを空のリストにする。
For each meta
element with a name
attribute and a content
attribute and where the name
attribute value is an ASCII case-insensitive match for keywords
:
もしあれば、keywordsに得られたトークンを追加する。
keywordsから重複を削除する。
keywordsを返す。これは、著者がページに適用可能として指定したキーワードのリストである。
値の信頼性への不十分な確信が存在する場合に、ユーザーエージェントは、この情報を使用すべきでない。
たとえば、コンテンツ管理システムがサイト固有の検索エンジンのインデックスを設定するためにシステム内のページのキーワード情報を使用することは合理的であるが、この情報を使用した大規模なコンテンツアグリゲータはおそらく、特定のユーザーが不適切なキーワードを使用してその順位メカニズムを操作しようとすることに気づく。
referrer
値は、Document
のデフォルトのリファラーポリシーを定義する、リファラーポリシーでなければならない。[REFERRERPOLICY]
If any meta
element element is inserted into the document, or has its name
or content
attributes changed, user agents must run the following algorithm:
If element is not in a document tree, then return.
If element does not have a name
attribute whose value is an ASCII case-insensitive match for "referrer
", then return.
If element does not have a content
attribute, or that attribute's value is the empty string, then return.
Let value be the value of element's content
attribute, converted to ASCII lowercase.
If value is one of the values given in the first column of the following table, then set value to the value given in the second column:
Legacy value | Referrer policy |
---|---|
never | no-referrer |
default | the default referrer policy |
always | unsafe-url |
origin-when-crossorigin | origin-when-cross-origin |
If value is a referrer policy, then set element's node document's policy container's referrer policy to policy.
For historical reasons, unlike other standard metadata names, the processing model for referrer
is not responsive to element removals, and does not use tree order. Only the most-recently-inserted or most-recently-modified meta
element in this state has an effect.
theme-color
値は、ユーザーエージェントがページや周囲のユーザーインターフェイスのの表示をカスタマイズするために使用すべき提案される色を定義する、CSS <color>生成物とマッチする文字列でなければならない。たとえば、ブラウザーは、指定された値でページのタイトルバーに色をつけるかもしれず、またはタブバーやタスクスイッチャーでカラーハイライトとして使用するかもしれない。
Within an HTML document, the media
attribute value must be unique amongst all the meta
elements with their name
attribute value set to an ASCII case-insensitive match for theme-color
.
この標準自身は、テーマカラーとして"WHATWG green"を使用している:
<!DOCTYPE HTML>
< title > HTML Standard</ title >
< meta name = "theme-color" content = "#3c790a" >
...
The media
attribute may be used to describe the context in which the provided color should be used.
If we only wanted to use "WHATWG green" as this standard's theme color in dark mode, we could use the prefers-color-scheme
media feature:
<!DOCTYPE HTML>
< title > HTML Standard</ title >
< meta name = "theme-color" content = "#3c790a" media = "(prefers-color-scheme: dark)" >
...
To obtain a page's theme color, user agents must run the following steps:
Let candidate elements be the list of all meta
elements that meet the following criteria, in tree order:
the element is in a document tree;
the element has a name
attribute, whose value is an ASCII case-insensitive match for theme-color
; and
the element has a content
attribute.
For each element in candidate elements:
If element has a media
attribute and the value of element's media
attribute does not match the environment, then continue.
Let value be the result of stripping leading and trailing ASCII whitespace from the value of element's content
attribute.
Let color be the result of parsing value.
If color is not failure, then return color.
Return nothing (the page has no theme color).
If any meta
elements are inserted into the document or removed from the document, or existing meta
elements have their name
, content
, or media
attributes changed, or if the environment changes such that any meta
element's media
attribute's value may now or may no longer match the environment, user agents must re-run the above algorithm and apply the result to any affected UI.
UIのテーマカラーを使用する場合、ユーザーエージェントは、問題のUIにテーマカラーより適切にするために実装固有の方法でテーマカラーを調整してもよい。たとえば、ユーザーエージェントが背景としてテーマカラーを使用しその上に白いテキストを表示しようとする場合、適切なコントラストを確保するために、UIの一部でテーマカラーのより暗い異なる色を使用するかもしれない。
color-scheme
To aid user agents in rendering the page background with the desired color scheme immediately (rather than waiting for all CSS in the page to load), a 'color-scheme' value can be provided in a meta
element.
The value must be a string that matches the syntax for the CSS 'color-scheme' property value. It determines the page's supported color-schemes.
There must not be more than one meta
element with its name
attribute value set to an ASCII case-insensitive match for color-scheme
per document.
The following declaration indicates that the page is aware of and can handle a color scheme with dark background colors and light foreground colors:
< meta name = "color-scheme" content = "dark" >
To obtain a page's supported color-schemes, user agents must run the following steps:
Let candidate elements be the list of all meta
elements that meet the following criteria, in tree order:
the element is in a document tree;
the element has a name
attribute, whose value is an ASCII case-insensitive match for color-scheme
; and
the element has a content
attribute.
For each element in candidate elements:
content
attribute.Return null.
If any meta
elements are inserted into the document or removed from the document, or existing meta
elements have their name
or content
attributes changed, user agents must re-run the above algorithm.
Because these rules check successive elements until they find a match, an author can provide multiple such values to handle fallback for legacy user agents. Opposite to how CSS fallback works for properties, the multiple meta elements needs to be arranged with the legacy values after the newer values.
誰でも独自の定義済みメタデータ名のセットに対する拡張を作成して使用することができる。そのような拡張を登録する必要はない。
ただし、次のいずれかの場合では新しいメタデータ名を作成すべきではない:
名前がURLであるか、付随するcontent
属性の値がURLである場合。このような場合では、(新しいメタデータ名を作成するよりもむしろ)リンクタイプの定義済みセットへの拡張として登録する。
名前がユーザーエージェントで処理要求があると予想されるものである場合。その場合、それは標準化されることが望ましい。
また、新しいメタデータ名を作成して使用する前に、すでに使用されているメタデータ名の選択を避け、すでに使用されているメタデータ名の複製を避け、かつ新しい標準化された名前があなたの選んだ名前と衝突することを避けるために、WHATWG Wiki MetaExtensions pageを参照することを勧める。[WHATWGWIKI]
誰でも自由にWHATWG Wiki MetaExtensions pageを編集して、いつでもメタデータ名を追加できる。新しいメタデータ名は、次の情報とともに指定することができる:
実際の名前が定義されている。名前は、他の定義済みの名前と紛らわしいものであるべきでない(たとえば、大文字と小文字だけが異なる)。
メタデータ名の意味はどのようなものかの短い非標準の説明は、その値が要求する形式を含む。
全く同じ処理要求を持つ他の名前のリスト。著者は、同義語であると定義された名前を使うべきではなく、同義語はユーザーエージェントがレガシーコンテンツをサポートするためだけのものである。誰もが実際に使用されてない同義語を削除できる。レガシーコンテンツとの互換性のために同義語として処理する必要がある名前のみが、この方法で登録されているのである。
以下のうちの1つをとる:
メタデータ名が既存の値とともに冗長であることが判明した場合、削除され、既存の値の同義語としてリストされているべきである。
メタデータ名が、使用するまたは指定することなく一月以上の期間"proposed"(提案)状態で追加される場合、WHATWG Wiki MetaExtensions pageから削除されることがある。
メタデータ名が"proposed"(提案)状態で追加され、既存の値とともに冗長であることが判明している場合、既存の値の同義語として削除され、リストされているべきである。メタデータ名は"proposed"(提案)状態で追加され、有害だと判明している場合、"discontinued"(中止)状態に変更すべきである。
誰もがいつでも状態を変更できるが、上記の定義にしたがってのみ行うべきである。
meta
要素でhttp-equiv
属性が指定された場合、要素はプラグマディレクティブである。
The http-equiv
attribute is an enumerated attribute with the following keywords and states:
キーワード | Conforming | 状態 | 概要 |
---|---|---|---|
content-language | No | Content language | Sets the pragma-set default language. |
content-type | Encoding declaration | An alternative form of setting the charset . | |
default-style | Default style | Sets the name of the default CSS style sheet set. | |
refresh | Refresh | Acts as a timed redirect. | |
set-cookie | No | Set-Cookie | Has no effect. |
x-ua-compatible | X-UA-Compatible | In practice, encourages Internet Explorer to more closely follow the specifications. | |
content-security-policy | Content security policy | Enforces a Content Security Policy on a Document . |
meta
要素が文書に挿入される場合、その要素のhttp-equiv
属性が存在しかつ上記の状態のいずれかを表す場合、以下のリストに記載されるように、ユーザーエージェントはその状態に対する適切なアルゴリズムを実行しなければならない:
http-equiv="content-language
"
)この機能は非適合である。著者は代わりにlang
属性を使用することを勧める。
このプラグマは、プラグマ設定のデフォルト言語を設定する。そのようなプラグマは正常に処理されるまで、プラグマ設定のデフォルト言語は存在しない。
If the element's content
attribute contains a U+002C COMMA character (,) then return.
Let input be the value of the element's content
attribute.
Let position point at the first character of input.
Skip ASCII whitespace within input given position.
Collect a sequence of code points that are not ASCII whitespace from input given position.
Let candidate be the string that resulted from the previous step.
If candidate is the empty string, return.
Set the pragma-set default language to candidate.
If the value consists of multiple space-separated tokens, tokens after the first are ignored.
このプラグマは、同じ名前のHTTP `Content-Language
`ヘッダーと完全ではないが、ほぼ大部分で異なる。[HTTP]
http-equiv="content-type
"
)エンコーディング宣言状態は、charset
属性の設定の単なる代替形式である。これは文字エンコーディング宣言である。この状態のユーザーエージェントの要件は、仕様の解析セクションによってすべて処理される。
For meta
elements with an http-equiv
attribute in the Encoding declaration state, the content
attribute must have a value that is an ASCII case-insensitive match for a string that consists of: "text/html;
", optionally followed by any number of ASCII whitespace, followed by "charset=utf-8
".
文書は、エンコーディング宣言状態のhttp-equiv
属性をもつmeta
要素と、charset
属性の存在するmeta
要素の両方を含んではならない。
エンコーディング宣言状態はHTML文書で使用されてもよいが、その状態のhttp-equiv
属性をもつ要素はXML文書で使用されてはならない。
http-equiv="default-style
"
)Support in one engine only.
このプラグマは、CSSスタイルシートセットの名前を設定する。
If the meta
element has no content
attribute, or if that attribute's value is the empty string, then return.
Change the preferred CSS style sheet set name with the name being the value of the element's content
attribute. [CSSOM]
http-equiv="refresh
"
)This pragma acts as a timed redirect.
Document
オブジェクトは、宣言的にリフレッシュに関連付けられている(真偽値)。最初はfalseである。
If the meta
element has no content
attribute, or if that attribute's value is the empty string, then return.
Let input be the value of the element's content
attribute.
Run the shared declarative refresh steps with the meta
element's node document, input, and the meta
element.
The shared declarative refresh steps, given a Document
object document, string input, and optionally a meta
element meta, are as follows:
If document's will declaratively refresh is true, then return.
Let position point at the first code point of input.
Skip ASCII whitespace within input given position.
Let time be 0.
Collect a sequence of code points that are ASCII digits from input given position, and let the result be timeString.
If timeString is the empty string, then:
If the code point in input pointed to by position is not U+002E (.), then return.
Otherwise, set time to the result of parsing timeString using the rules for parsing non-negative integers.
Collect a sequence of code points that are ASCII digits and U+002E FULL STOP characters (.) from input given position. Ignore any collected characters.
Let urlRecord be document's URL.
If position is not past the end of input, then:
If the code point in input pointed to by position is not U+003B (;), U+002C (,), or ASCII whitespace, then return.
Skip ASCII whitespace within input given position.
If the code point in input pointed to by position is U+003B (;) or U+002C (,), then advance position to the next code point.
Skip ASCII whitespace within input given position.
If position is not past the end of input, then:
Let urlString be the substring of input from the code point at position to the end of the string.
If the code point in input pointed to by position is U+0055 (U) or U+0075 (u), then advance position to the next code point. Otherwise, jump to the step labeled skip quotes.
If the code point in input pointed to by position is U+0052 (R) or U+0072 (r), then advance position to the next code point. Otherwise, jump to the step labeled parse.
If the code point in input pointed to by position is U+004C (L) or U+006C (l), then advance position to the next code point. Otherwise, jump to the step labeled parse.
Skip ASCII whitespace within input given position.
If the code point in input pointed to by position is U+003D (=), then advance position to the next code point. Otherwise, jump to the step labeled parse.
Skip ASCII whitespace within input given position.
Skip quotes: If the code point in input pointed to by position is U+0027 (') or U+0022 ("), then let quote be that code point, and advance position to the next code point. Otherwise, let quote be the empty string.
Set urlString to the substring of input from the code point at position to the end of the string.
If quote is not the empty string, and there is a code point in urlString equal to quote, then truncate urlString at that code point, so that it and all subsequent code points are removed.
Parse: Set urlRecord to the result of encoding-parsing a URL given urlString, relative to document.
If urlRecord is failure, then return.
Set document's will declaratively refresh to true.
次の手順のうちの1つ以上を実行する:
After the refresh has come due (as defined below), if the user has not canceled the redirect and, if meta is given, document's active sandboxing flag set does not have the sandboxed automatic features browsing context flag set, then navigate document's node navigable to urlRecord using document, with historyHandling set to "replace
".
For the purposes of the previous paragraph, a refresh is said to have come due as soon as the later of the following two conditions occurs:
It is important to use document here, and not meta's node document, as that might have changed between the initial set of steps and the refresh coming due and meta is not always given (in case of the HTTP `Refresh
` header).
Provide the user with an interface that, when selected, navigates document's node navigable to urlRecord using document.
Do nothing.
In addition, the user agent may, as with anything, inform the user of any and all aspects of its operation, including the state of any timers, the destinations of any timed redirects, and so forth.
リフレッシュ状態のhttp-equiv
属性をもつmeta
に対して、content
属性はいずれかからなる値を持たなければならない:
URL
"に一致するサブ文字列が続き、その後にU+003D EQUALS SIGN 文字(=)が続き、その後にリテラルにU+0027 APOSTROPHE(')またはU+0022 QUOTATION MARK(")で開始しない妥当なURLが続くもの。前者の場合、整数は、そのページが再読み込みされるよりも前の秒数を表す。後者の場合、整数は、与えられたURLのページで置き換えられるよりも前の秒数を表す。
ページが5分ごとにサーバーからの自動的な再読み込みを確実にするために、報道機関のフロントページは、そのページのhead
要素で次のマークアップを含むかもしれない:
< meta http-equiv = "Refresh" content = "300" >
次のようなマークアップを用いて、連続したページは、各ページが連続で次のページにリフレッシュさせることで、自動スライドショーとして使用されるかもしれない:
< meta http-equiv = "Refresh" content = "20; URL=page4.html" >
http-equiv="set-cookie
"
)This pragma is non-conforming and has no effect.
ユーザーエージェントは、このプラグマを無視することが要求される。
http-equiv="x-ua-compatible
"
)実際問題として、このプラグマは、仕様により密接に従うようにInternet Explorerに勧める。
X-UA-Compatible状態におけるhttp-equiv
属性をもつmeta
要素の場合、content
属性は、文字列"IE=edge
"に ASCII大文字・小文字不区別である値を持たなければならない。
ユーザーエージェントは、このプラグマを無視することが要求される。
http-equiv="content-security-policy
"
)このプラグマはDocument
のContent Security Policyを実施する。[CSP]
If the meta
element is not a child of a head
element, return.
If the meta
element has no content
attribute, or if that attribute's value is the empty string, then return.
Let policy be the result of executing Content Security Policy's parse a serialized Content Security Policy algorithm on the meta
element's content
attribute's value, with a source of "meta", and a disposition of "enforce".
Remove all occurrences of the report-uri
, frame-ancestors
, and sandbox
directives from policy.
Enforce the policy policy.
コンテンツセキュリティーポリシー状態でhttp-equiv
属性をもつmeta
要素の場合、content
属性は妥当なコンテンツセキュリティーポリシーからなる値を持たなければならないが、任意のreport-uri
、frame-ancestors
、またはsandbox
ディレクティブを含めてはならない。content
属性で指定されるコンテンツセキュリティーポリシーは、現在の文書上に実施される。[CSP]
At the time of inserting the meta
element to the document, it is possible that some resources have already been fetched. For example, images might be stored in the list of available images prior to dynamically inserting a meta
element with an http-equiv
attribute in the Content security policy state. Resources that have already been fetched are not guaranteed to be blocked by a Content Security Policy that's enforced late.
ページは、次のようなポリシーを使用して、インラインのJavaScriptの実行を防止するだけでなく、すべてのプラグインコンテンツをブロックすることにより、クロスサイトスクリプティング攻撃のリスクを軽減することを選択するかもしれない。
< meta http-equiv = "Content-Security-Policy" content = "script-src 'self'; object-src 'none'" >
一度に文書で特定の状態をもつ複数のmeta
要素が存在してはならない。
文字エンコーディング宣言は、文書の記憶または伝達に用いられる文字エンコーディングを指定するメカニズムである。
Encoding標準は、UTF-8文字エンコーディングの使用を要求し、それを識別するために"utf-8
"エンコーディングラベルの使用を要求する。これらの要件は、文書の文字エンコーディング宣言が存在する場合、"utf-8
"に対してASCII大文字・小文字不区別での一致を使用してエンコーディングラベルを指定する必要がある。文字エンコーディング宣言が存在するかどうかにかかわらず、文書のエンコードに使用される実際の文字エンコーディングはUTF-8でなければならない。[ENCODING]
上記の規則を適用するために、オーサリングツールは、新たに作成される文書にUTF-8を使用することをデフォルトに設定しなければならない。
次の制限も適用される:
さらに、meta
要素には多くの制限があるため、文書ごとに1つのmeta
ベースの文字エンコーディング宣言のみがあるかもしれない。
HTML文書がBOMで開始せず、かつそのエンコーディングがContent-Typeメタデータによって明示的に指定されず、かつ文書がiframe
srcdoc
文書でない場合、エンコーディングはcharset
属性をもつmeta
要素、またはエンコーディング宣言状態のhttp-equiv
属性をもつmeta
要素を使用して指定されなければならない。
フォームにユーザーが入力した、スクリプトによって生成されたURLでなど、文字エンコーディングは非ASCII文字を処理するために必要とされるため、すべてのエンコーディングがUS-ASCIIの範囲にあるときでさえも、文字エンコーディング宣言は、(Content-Typeメタデータ内または明示的にファイル内のいずれか)が必要である。
UTF-8でないエンコーディングの使用は、デフォルトで文書の文字エンコーディングを使うことで、フォーム提出およびURLエンコーディングで予期しない結果を招くかもしれない。
文書がiframe
srcdoc
文書である場合、文書は文字エンコーディング宣言を持ってはならない。(この場合、文書の一部はiframe
を含んでいるので、ソースはすでにデコードされている。)
XMLにおいて、必要ならば、XML宣言はインライン文字エンコーディング情報に対して使用されるべきである。
HTMLにおいて、文字エンコーディングがUTF-8であることを宣言するために、著者は(head
要素内で)文書のトップの近くに次のマークアップを含むかもしれない:
< meta charset = "utf-8" >
XMLにおいて、マークアップのはじめでXML宣言は代わりに用いられるかもしれない:
<?xml version="1.0" encoding="utf-8"?>
style
elementSupport in all current engines.
Support in all current engines.
head
の子であるnoscript
要素内。media
— 受け入れ可能なメディアblocking
— Whether the element is potentially render-blockingtitle
attribute has special semantics on this element: CSS style sheet set name[Exposed =Window ]
interface HTMLStyleElement : HTMLElement {
[HTMLConstructor ] constructor ();
attribute boolean disabled ;
[CEReactions ] attribute DOMString media ;
[SameObject , PutForwards =value ] readonly attribute DOMTokenList blocking ;
// also has obsolete members
};
HTMLStyleElement includes LinkStyle ;
style
要素は、著者に文書へCSSスタイルシートを埋め込むことを可能にする。style
要素は、スタイリング処理モデルへの、複数の入力の1つである。この要素は、ユーザーへのコンテンツを表すものでない。
Support in all current engines.
The disabled
getter steps are:
If this does not have an associated CSS style sheet, return false.
If this's associated CSS style sheet's disabled flag is set, return true.
Return false.
The disabled
setter steps are:
If this does not have an associated CSS style sheet, return.
If the given value is true, set this's associated CSS style sheet's disabled flag. Otherwise, unset this's associated CSS style sheet's disabled flag.
Importantly, disabled
attribute assignments only take effect when the style
element has an associated CSS style sheet:
const style = document. createElement( 'style' );
style. disabled = true ;
style. textContent = 'body { background-color: red; }' ;
document. body. append( style);
console. log( style. disabled); // false
media
属性は、スタイルが適用されるメディアを言う。値は妥当なメディアクエリーリストでなければならない。media
属性の値が環境にマッチしかつ他の関連する条件が適用される場合、ユーザーエージェントはスタイルを適用しなければならず、そうでなければスタイルを適用してはならない。
スタイルは、たとえば@media
ブロックの使用とともにCSSにおいて、さらに範囲が制限されるかもしれない。この仕様は、そのような追加の制限や要件を上書きしない。
media
属性が省略される場合、デフォルトでは"all
"であり、デフォルトのスタイルにより、すべてのメディアに適用されることを意味する。
The blocking
attribute is a blocking attribute.
Support in one engine only.
style
要素のtitle
属性はCSSスタイルシートセットを定義する。style
要素がtitle
属性を持たない場合、タイトルを持たない。先祖のtitle
属性はstyle
要素に適用しない。style
要素が文書ツリー内にない場合、title
属性は無視される。[CSSOM]
link
要素のtitle
属性のような、style
要素のtitle
属性は、グローバルtitle
属性とタイトルなしのstyle
ブロックが親要素のタイトルを継承しないという点で異なる。それは単にタイトルを持たない。
style
要素の子テキストコンテンツは、適合スタイルシートのテキストコンテンツでなければならない。
A style
element is implicitly potentially render-blocking if the element was created by its node document's parser.
The user agent must run the update a style
block algorithm whenever any of the following conditions occur:
The element is popped off the stack of open elements of an HTML parser or XML parser.
The element is not on the stack of open elements of an HTML parser or XML parser, and it becomes connected or disconnected.
The element's children changed steps run.
The update a style
block algorithm is as follows:
Let element be the style
element.
If element has an associated CSS style sheet, remove the CSS style sheet in question.
If element is not connected, then return.
If element's type
attribute is present and its value is neither the empty string nor an ASCII case-insensitive match for "text/css
", then return.
In particular, a type
value with parameters, such as "text/css; charset=utf-8
", will cause this algorithm to return early.
If the Should element's inline behavior be blocked by Content Security Policy? algorithm returns "Blocked
" when executed upon the style
element, "style
", and the style
element's child text content, then return. [CSP]
Create a CSS style sheet with the following properties:
element
The media
attribute of element.
This is a reference to the (possibly absent at this time) attribute, rather than a copy of the attribute's current value. CSSOM defines what happens when the attribute is dynamically set, changed, or removed.
The title
attribute of element, if element is in a document tree, or the empty string otherwise.
Again, this is a reference to the attribute.
Unset.
Set.
null
Left at its default value.
Left uninitialized.
This doesn't seem right. Presumably we should be using the element's child text content? Tracked as issue #2997.
If element contributes a script-blocking style sheet, append element to its node document's script-blocking style sheet set.
If element's media
attribute's value matches the environment and element is potentially render-blocking, then block rendering on element.
Once the attempts to obtain the style sheet's critical subresources, if any, are complete, or, if the style sheet has no critical subresources, once the style sheet has been parsed and processed, the user agent must run these steps:
Fetching the critical subresources is not well-defined; probably issue #968 is the best resolution for that. In the meantime, any critical subresource request should have its render-blocking set to whether or not the style
element is currently render-blocking.
Let element be the style
element associated with the style sheet in question.
Let success be true.
If the attempts to obtain any of the style sheet's critical subresources failed for any reason (e.g., DNS error, HTTP 404 response, a connection being prematurely closed, unsupported Content-Type), set success to false.
Note that content-specific errors, e.g., CSS parse errors or PNG decoding errors, do not affect success.
Queue an element task on the networking task source given element and the following steps:
If success is true, fire an event named load
at element.
Otherwise, fire an event named error
at element.
If element contributes a script-blocking style sheet:
Assert: element's node document's script-blocking style sheet set contains element.
Remove element from its node document's script-blocking style sheet set.
Unblock rendering on element.
The element must delay the load event of the element's node document until all the attempts to obtain the style sheet's critical subresources, if any, are complete.
This specification does not specify a style system, but CSS is expected to be supported by most web browsers. [CSS]
Support in all current engines.
The media
and blocking
IDL attributes must each reflect the respective content attributes of the same name.
LinkStyle
インターフェイスはまた、この要素によって実装される。[CSSOM]
次の文書は、デフォルトのイタリック体で作品とラテン語のタイトルを残したまま、イタリックテキストよりも明るい赤色のテキストとして強調するスタイルを持つ。適切な要素を使用した、文書のより簡単な再スタイル付けを可能にする方法を示す。
<!DOCTYPE html>
< html lang = "en-US" >
< head >
< title > My favorite book</ title >
< style >
body { color : black ; background : white ; }
em { font-style : normal ; color : red ; }
</ style >
</ head >
< body >
< p > My < em > favorite</ em > book of all time has < em > got</ em > to be
< cite > A Cat's Life</ cite > . It is a book by P. Rahmel that talks
about the < i lang = "la" > Felis catus</ i > in modern human society.</ p >
</ body >
</ html >
If the style sheet referenced no other resources (e.g., it was an internal style sheet given by a style
element with no @import
rules), then the style rules must be immediately made available to script; otherwise, the style rules must only be made available to script once the event loop reaches its update the rendering step.
An element el in the context of a Document
of an HTML parser or XML parser contributes a script-blocking style sheet if all of the following are true:
el was created by that Document
's parser.
el is either a style
element or a link
element that was an external resource link that contributes to the styling processing model when the el was created by the parser.
el's media
attribute's value matches the environment.
el's style sheet was enabled when the element was created by the parser.
The last time the event loop reached step 1, el's root was that Document
.
The user agent hasn't given up on loading that particular style sheet yet. A user agent may give up on loading a style sheet at any time.
スタイルシートが最終的にまだロードする場合、スタイルシートをロードする前にスタイルシートをあきらめることは、スクリプトが誤った情報で動作して終わるかもしれないことを意味する。For example, if a style sheet sets the color of an element to green, but a script that inspects the resulting style is executed before the sheet is loaded, the script will find that the element is black (or whatever the default color is), and might thus make poor choices (e.g., deciding to use black as the color elsewhere on the page, instead of green). Implementers have to balance the likelihood of a script using incorrect information with the performance impact of doing nothing while waiting for a slow network request to finish.
It is expected that counterparts to the above rules also apply to <?xml-stylesheet?>
PIs. However, this has not yet been thoroughly investigated.
A Document
has a script-blocking style sheet set, which is an ordered set, initially empty.
A Document
document has a style sheet that is blocking scripts if the following steps return true:
If document's script-blocking style sheet set is not empty, then return true.
If document's node navigable is null, then return false.
Let containerDocument be document's node navigable's container document.
If containerDocument is non-null and containerDocument's script-blocking style sheet set is not empty, then return true.
Return false.
A Document
has no style sheet that is blocking scripts if it does not have a style sheet that is blocking scripts.