HTML rel Attribute
HTML <link>
rel
Attribute
❮ HTML <link> tag
Example
Import an external stylesheet:
<link rel=”stylesheet” href=”styles.css”>
Try it Yourself »
More examples below.
Definition and Usage
The required rel attribute specifies the relationship between the current document and the linked document/resource.
Browser Support
Attribute
rel
Yes
Yes
Yes
Yes
Yes
Syntax
<link rel=”value“>
Attribute Values
Value
Description
alternate
Provides a link to an alternate version of the document (i.e. print page, translated or mirror).
Example: <link rel=”alternate” type=”application/atom+xml” title=”W3Schools News” href=”/blog/news/atom”>
author
Provides a link to the author of the document
dns-prefetch
Specifies that the browser should preemptively perform DNS resolution for the target resource’s origin
help
Provides a link to a help document. Example: <link rel=”help” href=”/help/”>
icon
Imports an icon to represent the document.
Example: <link rel=”icon” href=”favicon.ico” type=”image/x-icon”>
license
Provides a link to copyright information for the document
next
Provides a link to the next document in the series
pingback
Provides the address of the pingback server that handles pingbacks to the current document
preconnect
Specifies that the browser should preemptively connect to the target resource’s origin.
prefetch
Specifies that the browser should preemptively fetch and cache the target resource as it is likely to be required for a follow-up navigation
preload
Specifies that the browser agent must preemptively fetch and cache the target resource for current navigation according to the destination given by the “as” attribute (and the priority associated with that destination).
prerender
Specifies that the browser should pre-render (load) the specified
webpage in the background. So, if the user navigates to this page, it speeds
up the page load (because the page is already loaded). Warning!
This wastes the user’s bandwidth! Only use prerender if you are absolutely sure
that the webpage is required at some point in the user’s journey
prev
Indicates that the document is a part of a series, and that the previous document in the series is the referenced document
search
Provides a link to a resource that can be used to search through the current document and its related pages.
stylesheet
Imports a style sheet
More Examples
Example
Here is how to add a favicon 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>
❮ HTML <link> tag