The <link> tag

The <link> tag links an external resource into the document — most commonly a CSS stylesheet, a favicon, or a resource preload hint. It's a void element.

Syntax

<link rel="stylesheet" href="styles.css">

Attributes

rel	The relationship type: stylesheet, icon, canonical, preload, preconnect, alternate, and more.
href	The URL of the linked resource.
as	Required alongside rel="preload" — specifies the resource type (script, style, font, image).
media	A media query condition under which the stylesheet applies (e.g. print).

Example

<link rel="stylesheet" href="/css/main.css">
<link rel="icon" href="/favicon.png">
<link rel="canonical" href="https://example.com/page">

Notes

rel="canonical" tells search engines the primary version of a page when duplicate URLs exist.
rel="preload" with a missing or wrong as attribute may be ignored by the browser.

Related tools

The <meta> tag

charset, name/content, property, and http-equiv on the <meta> tag, with examples.

The <script> tag

The src, type, async, and defer attributes of the <script> tag, and the difference between them.