Open In App

How to specify the location of the linked document in HTML5?

Last Updated : 07 Apr, 2021
Improve
Improve
Like Article
Like
Save
Share
Report

In this article, we will learn how to specify the location of the linked document in HTML5. This can be done by using a href attribute in the <link> element. This has various uses. Most commonly it is used to link stylesheets or favicons to the document.

Syntax:

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

The below examples illustrate the use of the href attribute.

Example 1: In this example, an external stylesheet’s location is specified using the href attribute.

HTML




<html>
<head>
  
  <!-- Bootstrap CSS from CDN -->
  <link rel="stylesheet"
        href=
  
  <!-- Custom styling -->
  <style>
    h1 {
      color: green;
    }
  
    h1, h2 {
      text-align: center;
    }
  </style>
</head>
<body>
  <h1>GeeksforGeeks</h1>
  <h2>
    How to specify the location of the
    linked document in HTML5?
  </h2>
</body>
</html>


Output:

Example 2: In this example, the <a> tag is used to link the document using the href attribute.

HTML




<html>
<head>
  <style>
    h1 {
      color: green;
    }
  
    body {
      text-align: center;
    }
  </style>
</head>
<body>
  <h1>GeeksforGeeks</h1>
  <h2>
    How to specify the location of
    the linked document in HTML5?
  </h2>
    Click to open in the same tab
  </a>
</body>
</html>


Output:



Like Article
Suggest improvement
Previous
Next
Share your thoughts in the comments

Similar Reads