HTML <link> rel attribute

Definition and usage

Required rel The attribute specifies the relationship between the current document and the linked document/resource.

Instance

Example 1

Import an external stylesheet:

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

Try it yourself

Example 2

Here is how to add a website icon to a website:

<!DOCTYPE html>
<html>
<head>
  <title>My Page Title</title>
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>

Syntax

<link rel="value">

Attribute value

Value Description
alternate

Provide a link to the document's alternative representation (such as a print page, translation, or mirror).

Example: <link rel="alternate" type="application/atom+xml" href="/blog/news/atom">

author Provide a link to the document author.
dns-prefetch Specify that the browser should pre-fetch the DNS resolution for the source of the target resource.
help

Provide a link to the help document.

Example: <link rel="help" href="/help/">

icon

Import the icon representing the document.

Example: <link rel="icon" href="favicon.ico" type="image/x-icon">

license Provide a link to the document's copyright information.
next Provide a link to the next document in the series.
pingback Provide the address of the pingback server that handles the pingback for the current document.
preconnect Specifies that the browser should proactively connect to the source of the target resource.
prefetch Specifies that the browser should proactively fetch and cache the target resource because it may be used in subsequent navigation.
preload Specifies that the browser agent must proactively fetch and cache the target resource based on the destination provided by the 'as' attribute (and the priority associated with that destination).
prerender

Specifies that the browser should pre-render (load) the specified web page in the background.

If the user navigates to this page, it will speed up the page loading time (because the page has already been loaded).

Warning! This will waste the user's bandwidth! Only use pre-rendering when you are absolutely sure that the web page is necessary at some point during the user's browsing process.

prev Indicates that the file is part of a series and that the previous file in the series is the referenced file.
search Provide links to resources that can be used to search the current document and its related pages.
stylesheet Import Stylesheet.

Browser Support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support Support Support Support Support