Contents
HTML link Tag: Main Tips
- By using HTML
link
tag, you can set a link between a document and an external resource. - Unlike the <a> tag which is written in the <body> element, HTML
link
tag has to be placed in the <head>. - HTML
link
tag is typically used to link CSS to HTML for external stylesheets. - You don't need to use the ending tag.
Using link in HTML
Using the link
tag, HTML document can be linked with an external resource:
This tag is often used to link stylesheet to a document that needs to be styled. However, by including link
tag, HTML icons can be established as well.

- Easy to use with a learn-by-doing approach
- Offers quality content
- Gamified in-browser coding experience
- The price matches the quality
- Suitable for learners ranging from beginner to advanced
- Free certificates of completion
- Focused on data science skills
- Flexible learning timetable

- Simplistic design (no unnecessary information)
- High-quality courses (even the free ones)
- Variety of features
- Nanodegree programs
- Suitable for enterprises
- Paid Certificates of completion

- A wide range of learning programs
- University-level courses
- Easy to navigate
- Verified certificates
- Free learning track available
- University-level courses
- Suitable for enterprises
- Verified certificates of completion
Mostly Used link Tag Attributes
The href
attribute adds a path (URL) to the external document:
hreflang
sets the linked document's language:
<link rel="stylesheet" type="text/css" hreflang="en" href="style_file.css">
Note: you can only use hreflang alongside href.
media
defines what type of device the linked material is optimized for:
<link rel="stylesheet" type="text/css" href="print.css" media="print">
rel
defines the current document's and the linked document's relationship:
sizes
sets the size for the icon in the linked resource:
<link rel="icon" href="character.gif" type="image/gif" sizes="20x20">
Note: you can only use sizes when HTML rel has a value of an icon.
target
specifies where the linked document is to be loaded:
<link rel="parent" href="character.htm" target="_blank">
Note: usually this attribute is assigned for the linked page to load in another tab (not on the current page). The value needed in this case is _blank.
Deprecated Attributes for link
charset
defined the linked document's character encoding:
Tip: instead of charset, you can include a Content-Type HTTP header in the external file.
rev
defined the linked document's and the current document's relationship:
<link rev="parent" href="doggo.htm">
Tip: instead of rev, you can use HTML rel.
Browser support

Chrome

Edge

Firefox

IE

Opera

Safari
Mobile browser support

Chrome

Firefox

Opera
