link
elementnoscript
element that is a child of a
head
element.href
rel
media
hreflang
type
sizes
title
attribute has special semantics on this
element.
interface HTMLLinkElement : HTMLElement {
attribute boolean disabled;
attribute DOMString href;
attribute DOMString rel;
readonly attribute DOMTokenList relList;
attribute DOMString media;
attribute DOMString hreflang;
attribute DOMString type;
[PutForwards=value] readonly attribute DOMSettableTokenList sizes;
};
HTMLLinkElement implements LinkStyle;
The link
element allows authors to link their
document to other resources.
The destination of the link(s) is given by the href
attribute, which must be present and must contain a valid
non-empty URL potentially surrounded by spaces.
A link
element must have rel
attribute.
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 set of space-separated
tokens. The allowed
keywords and their meanings are defined in a later section.
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.
The exact behavior for links to external resources depends on the exact relationship, as defined for the relevant link type. Some of the attributes control whether or not the external resource is to be applied (as defined below).
Hyperlinks created with the link
element and its rel
attribute apply to the whole page. 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.
The media
attribute says which
media the resource applies to. The value must be a valid media query.
The default, if the media
attribute is omitted, is "all
", meaning that by default links apply to all
media.
The hreflang
attribute on the
link
element has the same semantics as the
hreflang
attribute on
a
and area
elements.
The type
attribute gives the
MIME type of the linked resource. It is purely
advisory. The value must be a valid MIME type.
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 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, where the
title
attribute defines
alternative 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 sizes
attribute is used with the icon
link type. The attribute must not be
specified on link
elements that do not have a
rel
attribute that specifies the icon
keyword.
The IDL attribute disabled
only applies to
style sheet links. When the link
element defines a style sheet link,
then the disabled
attribute behaves as defined
for the alternative style sheets
DOM. For all other link
elements it always return false and
does nothing on setting.
The LinkStyle
interface is also implemented by this element; the styling processing model defines
how. [CSSOM]
Here, a set of link
elements provide some style
sheets:
<!-- a persistent style sheet --> <link rel="stylesheet" href="default.css"> <!-- the preferred alternate style sheet --> <link rel="stylesheet" href="green.css" title="Green styles"> <!-- some alternate style sheets --> <link rel="alternate stylesheet" href="contrast.css" title="High contrast"> <link rel="alternate stylesheet" href="big.css" title="Big fonts"> <link rel="alternate stylesheet" href="wide.css" title="Wide screen">
The following example shows how you can specify versions of the page that use alternative formats, are aimed at other languages, and that are intended for other media:
<link rel=alternate href="/en/html" hreflang=en type=text/html title="English HTML"> <link rel=alternate href="/fr/html" hreflang=fr type=text/html title="French HTML"> <link rel=alternate href="/en/html/print" hreflang=en type=text/html media=print title="English HTML (for printing)"> <link rel=alternate href="/fr/html/print" hreflang=fr type=text/html media=print title="French HTML (for printing)"> <link rel=alternate href="/en/pdf" hreflang=en type=application/pdf title="English PDF"> <link rel=alternate href="/fr/pdf" hreflang=fr type=application/pdf title="French PDF">