Skip to content
Related Articles

Related Articles

HTML <link> Tag

View Discussion
Improve Article
Save Article
  • Last Updated : 26 Jul, 2022

The <link> tag in HTML is used to define a link between a document and an external resource. The link tag is mainly used to link to external style sheets. This element can appear multiple times but it goes only in the head section. The link element is empty, it contains attributes only. The values in the link element denote how the item being linked to & is related to the containing document.

Syntax:

 <link rel="stylesheet" type="text/css" href="styles.css">

Attributes values:

  • charset: It is used to specify the character encoding for the HTML linked document.
  • crossOrigin: It assigns the CORS settings of the linked document.
  • disabled: It is used to specify that the linked document is disabled.
  • href: It s used to specify the URL of the linked document.
  • hreflang: It is used to specify the language for a linked document.
  • media: It is used to specify what media/device the target resource is optimized for.
  • rel: It is used to specify the relationship between the current and the linked document.
  • rev: It assigns the reverse relationship from the linked document to the current document.
  • sizes: It is used to specify the sizes of the icon for visual media and it only works when rel=”icon”.
  • target: It is used to specify the window or a frame where the linked document is loaded.
  • type: It is used to set/return the content type of the linked document.

Example 1: In this example, we have used the <link> tag & declared the rel attribute & type attribute inside of the tag in HTML.

HTML




<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet"
          type="text/css"
          href="style.css">
</head>
 
<body>
    <h1>GeeksforGeeks</h1>
    <h3>HTML Link Tag</h3>
     
 
<p>
        A Computer Science portal for geeks.
        It contains well written, well thought
        and well explained computer science and
        programming articles.
    </p>
 
 
 
</body>
</html>

 Output:

HTML <link> tag

Example 2: In this example, we have used the hreflang attribute whose value is set to”en-us” which will specify the language of the linked document. And we are linking an external CSS file that contains a color property for the h1 tag which is set to green.

HTML




<!DOCTYPE html>
<html>
<head>
    <title>HTML Link Tag</title>
    <link rel="stylesheet"
          type="text/css"
          href="style.css"
          hreflang="en-us">
</head>
 
<body>
    <h1>GeeksforGeeks</h1>
    <h2>HTML Link Tag</h2>
</body>
</html>

Output:

HTML <link> tag

Supported Browsers:

  • Google Chrome 1
  • Internet Explorer 
  • Microsoft Edge 12
  • Firefox 1
  • Safari 
  • Opera 

My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!