HTML
Living Standard — Last Updated 19 June 2025
Living Standard — Last Updated 19 June 2025
html
element
Support in all current engines.
Support in all current engines.
head
element
followed
by
a
body
element.
[Exposed=Window]
interface HTMLHtmlElement : HTMLElement {
[HTMLConstructor] constructor();
// also has obsolete members
};
The
html
element
represents
the
root
of
an
HTML
document.
Authors
are
encouraged
to
specify
a
lang
attribute
on
the
root
html
element,
giving
the
document's
language.
This
aids
speech
synthesis
tools
to
determine
what
pronunciations
to
use,
translation
tools
to
determine
what
rules
to
use,
and
so
forth.
The
html
element
in
the
following
example
declares
that
the
document's
language
is
English.
<!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
element
Support in all current engines.
Support in all current engines.
html
element.
iframe
srcdoc
document
or
if
title
information
is
available
from
a
higher-level
protocol:
Zero
or
more
elements
of
metadata
content
,
of
which
no
more
than
one
is
a
title
element
and
no
more
than
one
is
a
base
element.
title
element
and
no
more
than
one
is
a
base
element.
[Exposed=Window]
interface HTMLHeadElement : HTMLElement {
[HTMLConstructor] constructor();
};
The
head
element
represents
a
collection
of
metadata
for
the
Document
.
The
collection
of
metadata
in
a
head
element
can
be
large
or
small.
Here
is
an
example
of
a
very
short
one:
<!doctype html>
<html lang=en>
<head>
<title>A document with a short head</title>
</head>
<body>
...
Here is an example of a longer one:
<!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
element
Support in all current engines.
Support in all current engines.
head
element
containing
no
other
title
elements.
[Exposed=Window]
interface HTMLTitleElement : HTMLElement {
[HTMLConstructor] constructor();
[CEReactions] attribute DOMString text;
};
The
title
element
represents
the
document's
title
or
name.
Authors
should
use
titles
that
identify
their
documents
even
when
they
are
used
out
of
context,
for
example
in
a
user's
history
or
bookmarks,
or
in
search
results.
The
document's
title
is
often
different
from
its
first
heading,
since
the
first
heading
does
not
have
to
stand
alone
when
taken
out
of
context.
There
must
be
no
more
than
one
title
element
per
document.
If
it's
reasonable
for
the
Document
to
have
no
title,
then
the
title
element
is
probably
not
required.
See
the
head
element's
content
model
for
a
description
of
when
the
element
is
required.
title
.
text
[
=
value
]
Returns the child text content of the element.
Can be set, to replace the element's children with the given 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.
Here are some examples of appropriate titles, contrasted with the top-level headings that might be used on those same pages.
<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...
The next page might be a part of the same site. Note how the title describes the subject matter unambiguously, while the first heading assumes the reader knows what the context is and therefore won't wonder if the dances are Salsa or Waltz:
<title>Dances used during bee mating rituals</title>
...
<h1>The
Dances</h1>
The
string
to
use
as
the
document's
title
is
given
by
the
document.title
IDL
attribute.
User
agents
should
use
the
document's
title
when
referring
to
the
document
in
their
user
interface.
When
the
contents
of
a
title
element
are
used
in
this
way,
the
directionality
of
that
title
element
should
be
used
to
set
the
directionality
of
the
document's
title
in
the
user
interface.
base
element
Support in all current engines.
Support in all current engines.
head
element
containing
no
other
base
elements.
href
target
[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
.
The
element
does
not
represent
any
content
beyond
this
information.
There
must
be
no
more
than
one
base
element
per
document.
A
base
element
must
have
either
an
href
attribute,
a
target
attribute,
or
both.
The
href
content
attribute,
if
specified,
must
contain
a
valid
URL
potentially
surrounded
by
spaces
.
A
base
element,
if
it
has
an
href
attribute,
must
come
before
any
other
elements
in
the
tree
that
have
attributes
defined
as
taking
URLs
.
If
there
are
multiple
base
elements
with
href
attributes,
all
but
the
first
are
ignored.
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
.
A
base
element,
if
it
has
a
target
attribute,
must
come
before
any
elements
in
the
tree
that
represent
hyperlinks
.
If
there
are
multiple
base
elements
with
target
attributes,
all
but
the
first
are
ignored.
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.
In
this
example,
a
base
element
is
used
to
set
the
document
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>
The
link
in
the
above
example
would
be
a
link
to
"
https://www.example.com/news/archives.html
".
link
element
Support in all current engines.
Support in all current engines.
noscript
element
that
is
a
child
of
a
head
element.
href
crossorigin
rel
media
integrity
hreflang
type
referrerpolicy
sizes
imagesrcset
imagesizes
as
blocking
color
disabled
fetchpriority
title
attribute
has
special
semantics
on
this
element.
[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
;
The
link
element
allows
authors
to
link
their
document
to
other
resources.
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.
The
types
of
link
indicated
(the
relationships)
are
given
by
the
value
of
the
rel
attribute,
which,
if
present,
must
have
a
value
that
is
a
unordered
set
of
unique
space-separated
tokens
.
The
allowed
keywords
and
their
meanings
are
defined
in
a
later
section.
If
the
rel
attribute
is
absent,
has
no
keywords,
or
if
none
of
the
keywords
used
are
allowed
according
to
the
definitions
in
this
specification,
then
the
element
does
not
create
any
links.
rel
's
supported
tokens
are
the
keywords
defined
in
HTML
link
types
which
are
allowed
on
link
elements,
impact
the
processing
model,
and
are
supported
by
the
user
agent.
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
.
A
link
element
must
have
either
a
rel
attribute
or
an
itemprop
attribute,
but
not
both.
If
a
link
element
has
an
itemprop
attribute,
or
has
a
rel
attribute
that
contains
only
keywords
that
are
body-ok
,
then
the
element
is
said
to
be
allowed
in
the
body
.
This
means
that
the
element
can
be
used
where
phrasing
content
is
expected.
If
the
rel
attribute
is
used,
the
element
can
only
sometimes
be
used
in
the
body
of
the
page.
When
used
with
the
itemprop
attribute,
the
element
can
be
used
both
in
the
head
element
and
in
the
body
of
the
page,
subject
to
the
constraints
of
the
microdata
model.
Two
categories
of
links
can
be
created
using
the
link
element:
links
to
external
resources
and
hyperlinks
.
The
link
types
section
defines
whether
a
particular
link
type
is
an
external
resource
or
a
hyperlink.
One
link
element
can
create
multiple
links
(of
which
some
might
be
external
resource
links
and
some
might
be
hyperlinks
);
exactly
which
and
how
many
links
are
created
depends
on
the
keywords
given
in
the
rel
attribute.
User
agents
must
process
the
links
on
a
per-link
basis,
not
a
per-element
basis.
Each
link
created
for
a
link
element
is
handled
separately.
For
instance,
if
there
are
two
link
elements
with
rel="stylesheet"
,
they
each
count
as
a
separate
external
resource,
and
each
is
affected
by
its
own
attributes
independently.
Similarly,
if
a
single
link
element
has
a
rel
attribute
with
the
value
next
stylesheet
,
it
creates
both
a
hyperlink
(for
the
next
keyword)
and
an
external
resource
link
(for
the
stylesheet
keyword),
and
they
are
affected
by
other
attributes
(such
as
media
or
title
)
differently.
For
example,
the
following
link
element
creates
two
hyperlinks
(to
the
same
page):
<link
rel="author
license"
href="/about">
The two links created by this element are one whose semantic is that the target page has information about the current page's author, and one whose semantic is that the target page has information regarding the license under which the current page is provided.
Hyperlinks
created
with
the
link
element
and
its
rel
attribute
apply
to
the
whole
document.
This
contrasts
with
the
rel
attribute
of
a
and
area
elements,
which
indicates
the
type
of
a
link
whose
context
is
given
by
the
link's
location
within
the
document.
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
.
The exact behavior for links to external resources depends on the exact relationship, as defined for the relevant link type .
The
crossorigin
attribute
is
a
CORS
settings
attribute
.
It
is
intended
for
use
with
external
resource
links
.
The
media
attribute
says
which
media
the
resource
applies
to.
The
value
must
be
a
valid
media
query
list
.
Support in all current engines.
The
integrity
attribute
represents
the
integrity
metadata
for
requests
which
this
element
is
responsible
for.
The
value
is
text.
The
attribute
must
only
be
specified
on
link
elements
that
have
a
rel
attribute
that
contains
the
stylesheet
,
preload
,
or
modulepreload
keyword.
[SRI]
The
hreflang
attribute
on
the
link
element
has
the
same
semantics
as
the
hreflang
attribute
on
the
a
element
.
The
type
attribute
gives
the
MIME
type
of
the
linked
resource.
It
is
purely
advisory.
The
value
must
be
a
valid
MIME
type
string
.
For
external
resource
links
,
the
type
attribute
is
used
as
a
hint
to
user
agents
so
that
they
can
avoid
fetching
resources
they
do
not
support.
The
referrerpolicy
attribute
is
a
referrer
policy
attribute
.
It
is
intended
for
use
with
external
resource
links
,
where
it
helps
set
the
referrer
policy
used
when
fetching
and
processing
the
linked
resource
.
[REFERRERPOLICY]
The
title
attribute
gives
the
title
of
the
link.
With
one
exception,
it
is
purely
advisory.
The
value
is
text.
The
exception
is
for
style
sheet
links
that
are
in
a
document
tree
,
for
which
the
title
attribute
defines
CSS
style
sheet
sets
.
The
title
attribute
on
link
elements
differs
from
the
global
title
attribute
of
most
other
elements
in
that
a
link
without
a
title
does
not
inherit
the
title
of
the
parent
element:
it
merely
has
no
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>
The
sizes
attribute
gives
the
sizes
of
icons
for
visual
media.
Its
value,
if
present,
is
merely
advisory.
User
agents
may
use
the
value
to
decide
which
icon(s)
to
use
if
multiple
icons
are
available.
If
specified,
the
attribute
must
have
a
value
that
is
an
unordered
set
of
unique
space-separated
tokens
which
are
ASCII
case-insensitive
.
Each
value
must
be
either
an
ASCII
case-insensitive
match
for
the
string
"
any
",
or
a
value
that
consists
of
two
valid
non-negative
integers
that
do
not
have
a
leading
U+0030
DIGIT
ZERO
(0)
character
and
that
are
separated
by
a
single
U+0078
LATIN
SMALL
LETTER
X
or
U+0058
LATIN
CAPITAL
LETTER
X
character.
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.
The
apple-touch-icon
keyword
is
a
registered
extension
to
the
predefined
set
of
link
types
,
but
user
agents
are
not
required
to
support
it
in
any
way.
The
as
attribute
specifies
the
potential
destination
for
a
preload
request
for
the
resource
given
by
the
href
attribute.
It
is
an
enumerated
attribute
.
Each
potential
destination
is
a
keyword
for
this
attribute,
mapping
to
a
state
of
the
same
name.
The
attribute
must
be
specified
on
link
elements
that
have
a
rel
attribute
that
contains
the
preload
keyword.
It
may
be
specified
on
link
elements
that
have
a
rel
attribute
that
contains
the
modulepreload
keyword;
in
such
cases
it
must
have
a
value
which
is
a
script-like
destination
.
For
other
link
elements,
it
must
not
be
specified.
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.
The
attribute
does
not
have
a
missing
value
default
or
invalid
value
default
,
meaning
that
invalid
or
missing
values
for
the
attribute
map
to
no
state.
This
is
accounted
for
in
the
processing
model.
For
preload
links,
both
conditions
are
an
error;
for
modulepreload
links,
a
missing
value
will
be
treated
as
"
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.
The
color
attribute
is
used
with
the
mask-icon
link
type.
The
attribute
must
only
be
specified
on
link
elements
that
have
a
rel
attribute
that
contains
the
mask-icon
keyword.
The
value
must
be
a
string
that
matches
the
CSS
<color>
production,
defining
a
suggested
color
that
user
agents
can
use
to
customize
the
display
of
the
icon
that
the
user
sees
when
they
pin
your
site.
This
specification
does
not
have
any
user
agent
requirements
for
the
color
attribute.
The
mask-icon
keyword
is
a
registered
extension
to
the
predefined
set
of
link
types
,
but
user
agents
are
not
required
to
support
it
in
any
way.
link
elements
have
an
associated
explicitly
enabled
boolean.
It
is
initially
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
If
the
link
is
a
hyperlink
then
the
media
attribute
is
purely
advisory,
and
describes
for
which
media
the
document
in
question
was
designed.
However,
if
the
link
is
an
external
resource
link
,
then
the
media
attribute
is
prescriptive.
The
user
agent
must
apply
the
external
resource
when
the
media
attribute's
value
matches
the
environment
and
the
other
relevant
conditions
apply,
and
must
not
apply
it
otherwise.
The
default,
if
the
media
attribute
is
omitted,
is
"
all
",
meaning
that
by
default
links
apply
to
all
media.
The
external
resource
might
have
further
restrictions
defined
within
that
limit
its
applicability.
For
example,
a
CSS
style
sheet
might
have
some
@media
blocks.
This
specification
does
not
override
such
further
restrictions
or
requirements.
type
attribute
If
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.
User
agents
must
not
consider
the
type
attribute
authoritative
—
upon
fetching
the
resource,
user
agents
must
not
use
the
type
attribute
to
determine
its
actual
type.
Only
the
actual
type
(as
defined
in
the
next
paragraph)
is
used
to
determine
whether
to
apply
the
resource,
not
the
aforementioned
assumed
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.
The
stylesheet
link
type
defines
rules
for
processing
the
resource's
Content-Type
metadata
.
Once the user agent has established the type of the resource, the user agent must apply the resource if it is of a supported type and the other relevant conditions apply, and must ignore the resource otherwise.
If a document contains style sheet links labeled as follows:
<link rel="stylesheet" href="A" type="text/plain">
<link rel="stylesheet" href="B" type="text/css">
<link
rel="stylesheet"
href="C">
...then
a
compliant
UA
that
supported
only
CSS
style
sheets
would
fetch
the
B
and
C
files,
and
skip
the
A
file
(since
text/plain
is
not
the
MIME
type
for
CSS
style
sheets).
For
files
B
and
C,
it
would
then
check
the
actual
types
returned
by
the
server.
For
those
that
are
sent
as
text/css
,
it
would
apply
the
styles,
but
for
those
labeled
as
text/plain
,
or
any
other
type,
it
would
not.
If
one
of
the
two
files
was
returned
without
a
Content-Type
metadata,
or
with
a
syntactically
incorrect
type
like
Content-Type: "null"
,
then
the
default
type
for
stylesheet
links
would
kick
in.
Since
that
default
type
is
text/css
,
the
style
sheet
would
nonetheless
be
applied.
link
element
All
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
`
headers
All
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
attribute
referrerpolicy
content
attribute
fetchpriority
content
attribute
If
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
headers
.
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
Interactive
user
agents
may
provide
users
with
a
means
to
follow
the
hyperlinks
created
using
the
link
element,
somewhere
within
their
user
interface.
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
attribute)
title
attribute).
href
attribute).
hreflang
attribute).
media
attribute).
User
agents
could
also
include
other
information,
such
as
the
type
of
the
resource
(as
given
by
the
type
attribute).
meta
element
Support in all current engines.
Support in all current engines.
itemprop
attribute
is
present:
flow
content
.
itemprop
attribute
is
present:
phrasing
content
.
charset
attribute
is
present,
or
if
the
element's
http-equiv
attribute
is
in
the
Encoding
declaration
state
:
in
a
head
element.
http-equiv
attribute
is
present
but
not
in
the
Encoding
declaration
state
:
in
a
head
element.
http-equiv
attribute
is
present
but
not
in
the
Encoding
declaration
state
:
in
a
noscript
element
that
is
a
child
of
a
head
element.
name
attribute
is
present:
where
metadata
content
is
expected.
itemprop
attribute
is
present:
where
metadata
content
is
expected.
itemprop
attribute
is
present:
where
phrasing
content
is
expected.
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
};
The
meta
element
represents
various
kinds
of
metadata
that
cannot
be
expressed
using
the
title
,
base
,
link
,
style
,
and
script
elements.
The
meta
element
can
represent
document-level
metadata
with
the
name
attribute,
pragma
directives
with
the
http-equiv
attribute,
and
the
file's
character
encoding
declaration
when
an
HTML
document
is
serialized
to
string
form
(e.g.
for
transmission
over
the
network
or
for
disk
storage)
with
the
charset
attribute.
Exactly
one
of
the
name
,
http-equiv
,
charset
,
and
itemprop
attributes
must
be
specified.
If
either
name
,
http-equiv
,
or
itemprop
is
specified,
then
the
content
attribute
must
also
be
specified.
Otherwise,
it
must
be
omitted.
The
charset
attribute
specifies
the
character
encoding
used
by
the
document.
This
is
a
character
encoding
declaration
.
If
the
attribute
is
present,
its
value
must
be
an
ASCII
case-insensitive
match
for
the
string
"
utf-8
".
The
charset
attribute
on
the
meta
element
has
no
effect
in
XML
documents,
but
is
allowed
in
XML
documents
in
order
to
facilitate
migration
to
and
from
XML.
There
must
not
be
more
than
one
meta
element
with
a
charset
attribute
per
document.
The
content
attribute
gives
the
value
of
the
document
metadata
or
pragma
directive
when
the
element
is
used
for
those
purposes.
The
allowed
values
depend
on
the
exact
context,
as
described
in
subsequent
sections
of
this
specification.
If
a
meta
element
has
a
name
attribute,
it
sets
document
metadata.
Document
metadata
is
expressed
in
terms
of
name-value
pairs,
the
name
attribute
on
the
meta
element
giving
the
name,
and
the
content
attribute
on
the
same
element
giving
the
value.
The
name
specifies
what
aspect
of
metadata
is
being
set;
valid
names
and
the
meaning
of
their
values
are
described
in
the
following
sections.
If
a
meta
element
has
no
content
attribute,
then
the
value
part
of
the
metadata
name-value
pair
is
the
empty
string.
The
media
attribute
says
which
media
the
metadata
applies
to.
The
value
must
be
a
valid
media
query
list
.
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.
This
specification
defines
a
few
names
for
the
name
attribute
of
the
meta
element.
Names are case-insensitive , and must be compared in an ASCII case-insensitive manner .
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.
There
must
not
be
more
than
one
meta
element
with
a
given
language
and
where
the
name
attribute
value
is
an
ASCII
case-insensitive
match
for
application-name
per
document.
User
agents
may
use
the
application
name
in
UI
in
preference
to
the
page's
title
,
since
the
title
might
include
status
messages
and
the
like
relevant
to
the
status
of
the
page
at
a
particular
moment
in
time
instead
of
just
being
the
name
of
the
application.
To find the application name to use given an ordered list of languages (e.g. British English, American English, and English), user agents must run the following steps:
Let languages be the list of languages.
Let
default
language
be
the
language
of
the
Document
's
document
element
,
if
any,
and
if
that
language
is
not
unknown.
If there is a default language , and if it is not the same language as any of the languages in languages , append it to 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
.
This algorithm would be used by a browser when it needs a name for the page, for instance, to label a bookmark. The languages it would provide to the algorithm would be the user's preferred languages.
author
The value must be a free-form string giving the name of one of the page's authors.
description
The
value
must
be
a
free-form
string
that
describes
the
page.
The
value
must
be
appropriate
for
use
in
a
directory
of
pages,
e.g.
in
a
search
engine.
There
must
not
be
more
than
one
meta
element
where
the
name
attribute
value
is
an
ASCII
case-insensitive
match
for
description
per
document.
generator
The value must be a free-form string that identifies one of the software packages used to generate the document. This value must not be used on pages whose markup is not generated by software, e.g. pages whose markup was written by a user in a text editor.
Here
is
what
a
tool
called
"Frontweaver"
could
include
in
its
output,
in
the
page's
head
element,
to
identify
itself
as
the
tool
used
to
generate
the
page:
<meta
name=generator
content="Frontweaver
8.2">
keywords
The value must be a set of comma-separated tokens , each of which is a keyword relevant to the page.
This
page
about
typefaces
on
British
motorways
uses
a
meta
element
to
specify
some
keywords
that
users
might
use
to
look
for
the
page:
<!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>
...
Many search engines do not consider such keywords, because this feature has historically been used unreliably and even misleadingly as a way to spam search engine results in a way that is not helpful for users.
To obtain the list of keywords that the author has specified as applicable to the page, the user agent must run the following steps:
Let keywords be an empty list.
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
:
Split
the
value
of
the
element's
content
attribute
on
commas
.
Add the resulting tokens, if any, to keywords .
Remove any duplicates from keywords .
Return keywords . This is the list of keywords that the author has specified as applicable to the page.
User agents should not use this information when there is insufficient confidence in the reliability of the value.
For instance, it would be reasonable for a content management system to use the keyword information of pages within the system to populate the index of a site-specific search engine, but a large-scale content aggregator that used this information would likely find that certain users would try to game its ranking mechanism through the use of inappropriate keywords.
referrer
The
value
must
be
a
referrer
policy
,
which
defines
the
default
referrer
policy
for
the
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
The value must be a string that matches the CSS <color> production, defining a suggested color that user agents should use to customize the display of the page or of the surrounding user interface. For example, a browser might color the page's title bar with the specified value, or use it as a color highlight in a tab bar or task switcher.
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
.
This standard itself uses "WHATWG green" as its theme color:
<!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.
When using the theme color in UI, user agents may adjust it in implementation-specific ways to make it more suitable for the UI in question. For example, if a user agent intends to use the theme color as a background and display white text over it, it might use a darker variant of the theme color in that part of the UI, to ensure adequate contrast.
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.
Anyone can create and use their own extensions to the predefined set of metadata names . There is no requirement to register such extensions.
However, a new metadata name should not be created in any of the following cases:
If
either
the
name
is
a
URL
,
or
the
value
of
its
accompanying
content
attribute
is
a
URL
;
in
those
cases,
registering
it
as
an
extension
to
the
predefined
set
of
link
types
is
encouraged
(rather
than
creating
a
new
metadata
name).
If the name is for something expected to have processing requirements in user agents; in that case it ought to be standardized.
Also, before creating and using a new metadata name, consulting the WHATWG Wiki MetaExtensions page is encouraged — to avoid choosing a metadata name that's already in use, and to avoid duplicating the purpose of any metadata names that are already in use, and to avoid new standardized names clashing with your chosen name. [WHATWGWIKI]
Anyone is free to edit the WHATWG Wiki MetaExtensions page at any time to add a metadata name. New metadata names can be specified with the following information:
The actual name being defined. The name should not be confusingly similar to any other defined name (e.g. differing only in case).
A short non-normative description of what the metadata name's meaning is, including the format the value is required to be in.
A list of other names that have exactly the same processing requirements. Authors should not use the names defined to be synonyms (they are only intended to allow user agents to support legacy content). Anyone may remove synonyms that are not used in practice; only names that need to be processed as synonyms for compatibility with legacy content are to be registered in this way.
One of the following:
If a metadata name is found to be redundant with existing values, it should be removed and listed as a synonym for the existing value.
If a metadata name is added in the "proposed" state for a period of a month or more without being used or specified, then it may be removed from the WHATWG Wiki MetaExtensions page.
If a metadata name is added with the "proposed" status and found to be redundant with existing values, it should be removed and listed as a synonym for the existing value. If a metadata name is added with the "proposed" status and found to be harmful, then it should be changed to "discontinued" status.
Anyone can change the status at any time, but should only do so in accordance with the definitions above.
When
the
http-equiv
attribute
is
specified
on
a
meta
element,
the
element
is
a
pragma
directive.
The
http-equiv
attribute
is
an
enumerated
attribute
with
the
following
keywords
and
states:
| Keyword | Conforming | State | Brief description |
|---|---|---|---|
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
.
|
When
a
meta
element
is
inserted
into
the
document
,
if
its
http-equiv
attribute
is
present
and
represents
one
of
the
above
states,
then
the
user
agent
must
run
the
algorithm
appropriate
for
that
state,
as
described
in
the
following
list:
http-equiv="
content-language
"
)
This
feature
is
non-conforming.
Authors
are
encouraged
to
use
the
lang
attribute
instead.
This pragma sets the pragma-set default language . Until such a pragma is successfully processed, there is no pragma-set default language .
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.
This
pragma
is
almost,
but
not
quite,
entirely
unlike
the
HTTP
`
Content-Language
`
header
of
the
same
name.
[HTTP]
http-equiv="
content-type
"
)
The
Encoding
declaration
state
is
just
an
alternative
form
of
setting
the
charset
attribute:
it
is
a
character
encoding
declaration
.
This
state's
user
agent
requirements
are
all
handled
by
the
parsing
section
of
the
specification.
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
".
A
document
must
not
contain
both
a
meta
element
with
an
http-equiv
attribute
in
the
Encoding
declaration
state
and
a
meta
element
with
the
charset
attribute
present.
The
Encoding
declaration
state
may
be
used
in
HTML
documents
,
but
elements
with
an
http-equiv
attribute
in
that
state
must
not
be
used
in
XML
documents
.
http-equiv="
default-style
"
)
Support in one engine only.
This pragma sets the name of the default CSS style sheet set .
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.
A
Document
object
has
an
associated
will
declaratively
refresh
(a
boolean).
It
is
initially
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
.
be
the
result.
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.
Perform one or more of the following steps:
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.
For
meta
elements
with
an
http-equiv
attribute
in
the
Refresh
state
,
the
content
attribute
must
have
a
value
consisting
either
of:
URL
",
followed
by
a
U+003D
EQUALS
SIGN
character
(=),
followed
by
a
valid
URL
string
that
does
not
start
with
a
literal
U+0027
APOSTROPHE
(')
or
U+0022
QUOTATION
MARK
(")
character.
In the former case, the integer represents a number of seconds before the page is to be reloaded; in the latter case the integer represents a number of seconds before the page is to be replaced by the page at the given URL .
A
news
organization's
front
page
could
include
the
following
markup
in
the
page's
head
element,
to
ensure
that
the
page
automatically
reloads
from
the
server
every
five
minutes:
<meta
http-equiv="Refresh"
content="300">
A sequence of pages could be used as an automated slide show by making each page refresh to the next page in the sequence, using markup such as the following:
<meta
http-equiv="Refresh"
content="20;
URL=page4.html">
http-equiv="
set-cookie
"
)
This pragma is non-conforming and has no effect.
User agents are required to ignore this pragma.
http-equiv="
x-ua-compatible
"
)
In practice, this pragma encourages Internet Explorer to more closely follow the specifications.
For
meta
elements
with
an
http-equiv
attribute
in
the
X-UA-Compatible
state
,
the
content
attribute
must
have
a
value
that
is
an
ASCII
case-insensitive
match
for
the
string
"
IE=edge
".
User agents are required to ignore this pragma.
http-equiv="
content-security-policy
"
)
This
pragma
enforces
a
Content
Security
Policy
on
a
Document
.
[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 .
For
meta
elements
with
an
http-equiv
attribute
in
the
Content
security
policy
state
,
the
content
attribute
must
have
a
value
consisting
of
a
valid
Content
Security
Policy
,
but
must
not
contain
any
report-uri
,
frame-ancestors
,
or
sandbox
directives
.
The
Content
Security
Policy
given
in
the
content
attribute
will
be
enforced
upon
the
current
document.
[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.
A page might choose to mitigate the risk of cross-site scripting attacks by preventing the execution of inline JavaScript, as well as blocking all plugin content, using a policy such as the following:
<meta
http-equiv="Content-Security-Policy"
content="script-src
'self';
object-src
'none'">
There
must
not
be
more
than
one
meta
element
with
any
particular
state
in
the
document
at
a
time.
A character encoding declaration is a mechanism by which the character encoding used to store or transmit a document is specified.
The
Encoding
standard
requires
use
of
the
UTF-8
character
encoding
and
requires
use
of
the
"
utf-8
"
encoding
label
to
identify
it.
Those
requirements
necessitate
that
the
document's
character
encoding
declaration
,
if
it
exists,
specifies
an
encoding
label
using
an
ASCII
case-insensitive
match
for
"
utf-8
".
Regardless
of
whether
a
character
encoding
declaration
is
present
or
not,
the
actual
character
encoding
used
to
encode
the
document
must
be
UTF-8
.
[ENCODING]
To enforce the above rules, authoring tools must default to using UTF-8 for newly-created documents.
The following restrictions also apply:
In
addition,
due
to
a
number
of
restrictions
on
meta
elements,
there
can
only
be
one
meta
-based
character
encoding
declaration
per
document.
If
an
HTML
document
does
not
start
with
a
BOM,
and
its
encoding
is
not
explicitly
given
by
Content-Type
metadata
,
and
the
document
is
not
an
iframe
srcdoc
document
,
then
the
encoding
must
be
specified
using
a
meta
element
with
a
charset
attribute
or
a
meta
element
with
an
http-equiv
attribute
in
the
Encoding
declaration
state
.
A character encoding declaration is required (either in the Content-Type metadata or explicitly in the file) even when all characters are in the ASCII range, because a character encoding is needed to process non-ASCII characters entered by the user in forms, in URLs generated by scripts, and so forth.
Using non-UTF-8 encodings can have unexpected results on form submission and URL encodings, which use the document's character encoding by default.
If
the
document
is
an
iframe
srcdoc
document
,
the
document
must
not
have
a
character
encoding
declaration
.
(In
this
case,
the
source
is
already
decoded,
since
it
is
part
of
the
document
that
contained
the
iframe
.)
In XML, the XML declaration should be used for inline character encoding information, if necessary.
In
HTML,
to
declare
that
the
character
encoding
is
UTF-8
,
the
author
could
include
the
following
markup
near
the
top
of
the
document
(in
the
head
element):
<meta
charset="utf-8">
In XML, the XML declaration would be used instead, at the very top of the markup:
<?xml
version="1.0"
encoding="utf-8"?>
style
element
Support in all current engines.
Support in all current engines.
noscript
element
that
is
a
child
of
a
head
element.
media
blocking
title
attribute
has
special
semantics
on
this
element.
[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
;
The
style
element
allows
authors
to
embed
CSS
style
sheets
in
their
documents.
The
style
element
is
one
of
several
inputs
to
the
styling
processing
model.
The
element
does
not
represent
content
for
the
user.
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
The
media
attribute
says
which
media
the
styles
apply
to.
The
value
must
be
a
valid
media
query
list
.
The
user
agent
must
apply
the
styles
when
the
media
attribute's
value
matches
the
environment
and
the
other
relevant
conditions
apply,
and
must
not
apply
them
otherwise.
The
styles
might
be
further
limited
in
scope,
e.g.
in
CSS
with
the
use
of
@media
blocks.
This
specification
does
not
override
such
further
restrictions
or
requirements.
The
default,
if
the
media
attribute
is
omitted,
is
"
all
",
meaning
that
by
default
styles
apply
to
all
media.
The
blocking
attribute
is
a
blocking
attribute
.
Support in one engine only.
The
title
attribute
on
style
elements
defines
CSS
style
sheet
sets
.
If
the
style
element
has
no
title
attribute,
then
it
has
no
title;
the
title
attribute
of
ancestors
does
not
apply
to
the
style
element.
If
the
style
element
is
not
in
a
document
tree
,
then
the
title
attribute
is
ignored.
[CSSOM]
The
title
attribute
on
style
elements,
like
the
title
attribute
on
link
elements,
differs
from
the
global
title
attribute
in
that
a
style
block
without
a
title
does
not
inherit
the
title
of
the
parent
element:
it
merely
has
no
title.
The
child
text
content
of
a
style
element
must
be
that
of
a
conformant
style
sheet
.
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.
The
LinkStyle
interface
is
also
implemented
by
this
element.
[CSSOM]
The following document has its stress emphasis styled as bright red text rather than italics text, while leaving titles of works and Latin words in their default italics. It shows how using appropriate elements enables easier restyling of documents.
<!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.
Giving up on a style sheet before the style sheet loads, if the style sheet eventually does still load, means that the script might end up operating with incorrect information. 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
.