HTML <link> element

The <link> element defines a relationship between the document and another resource. It usually appears in the <head> and has no visible link text. A clickable link within page content is normally supplied by <a>.

The rel attribute identifies the relationship, and href supplies the resource address. For example, rel="stylesheet" href="styles.css" loads an external stylesheet. Other relationships identify icons, alternate versions, canonical addresses, manifests, or resources to prepare in advance. Each relationship determines how its resource is used.

A link must specify either rel or the global itemprop attribute, but not both. The latter supplies a microdata property. At least one of href and imagesrcset must be present; the image-source alternative is used for responsive image preloading.

Some links can also occur in the <body>. These include links using itemprop, subject to the microdata rules, and links whose rel values are all permitted there, such as stylesheet. Other relationships, such as icon, belong in the head.

The descriptive attributes depend on the relationship. The type attribute gives a resource-type hint, hreflang describes the linked resource’s language, and media specifies applicable media conditions. For icons, sizes describes available dimensions; color supplies a colour for a mask icon.

For preloading, as identifies the resource destination, such as image or font. The attributes imagesrcset and imagesizes support responsive image selection. The fetchpriority attribute gives a relative fetching-priority hint; it does not guarantee download order.

The request-related attributes include crossorigin for cross-origin request handling, referrerpolicy for referrer information, and integrity for checking the fetched resource against a supplied hash. For stylesheet links, disabled controls whether the stylesheet link is enabled. Where applicable, blocking="render" requests that rendering wait for the resource.

The <link> element is a void element, with no contents or closing tag. The two declarations below illustrate a stylesheet and an icon; the named files must be supplied by the page author.

Attributes: href, crossorigin, rel, media, hreflang, type, sizes, imagesrcset, imagesizes, as, blocking, color, disabled, fetchpriority, integrity, referrerpolicy, GLOBALS.

Typical layout:
<head>
  <link rel="stylesheet" href="styles.css">
  <link rel="icon" href="favicon.ico">
</head>

Visual representation: