HTML <link> Tag with Examples

Learn about the link tag in HTML with its usages, syntax, and examples.
Submitted by Shahnail Khan, on April 08, 2022

HTML is the backbone of the website. We use opening and closing tags in HTML to display the elements on a webpage. There are many tags in HTML, but knowing ten basic HTML tags is more than enough to design the website. The <link> tag is one of the ten basic HTML tags that we should know.

What is <link> Tag?

The <link> tag specifies the correlation between the current document and an external resource. The <link> tag is put inside the <head> section. It is mostly used when we want to add external CSS to an HTML document.

Syntax:

<link attribute (1) ="value (1)" attribute (2) = "value (2)">

<link> Tag Attributes

The Attributes supported by the <link> tag are:

href - Indicates the link destination
hreflang - Defines the language you are using on a specific page
media - Specifies the device on which the linked document will be displayed.
refferrerpolicy - Defines the referrer used when linking the resource
rel - It defines the relationship between the HTML document and the linked CSS document.
title - Specifies the title of the stylesheet
type - Defines the media type used when linking the document.

It also supports global and event attributes in HTML.

<link> Tag Example

CSS:

.container{
    font: 2em x-large;
    background-color: yellow;
}

HTML:

<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Link tag</title>
      <link rel="stylesheet" href="customize.css">
   </head>
   <body>
      <div class="container">
         <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Rerum, aliquid eum libero quis ipsa quidem. Repellat eaque,
            corporis deleniti sapiente, amet iste possimus atque est enim ut autem repellendus illo!
         </p>
      </div>
   </body>
</html>

Output:

We have written our code in HTML document and external CSS is added using link tag inside the head section of the document. We have saved the CSS file name as "customized.css". The href attribute is used to located this CSS file.

Comments and Discussions!

Load comments ↻

Top MCQs

Top Programs/Examples