HTML Link Tag

HTML, or Hypertext Markup Language, is the standard language used to create websites. One of the essential components of HTML is the link tag. The link tag is used to link web pages to other resources, such as style sheets, scripts, and images. This article will explain the link tag and how to use it with an example and output.

The link tag is used to link an HTML document to an external resource, such as a style sheet. It is located in the head section of the HTML document and is used to associate a resource with a specific HTML element. The link tag has three primary attributes: href, rel, and type.

  • The href attribute specifies the location of the resource that you want to link to. This can be a URL, a file path, or an anchor point.
  • The rel attribute specifies the relationship between the HTML document and the resource that you are linking to. This attribute is essential because it helps the browser understand how to use the linked resource. For example, if you are linking to a style sheet, you would use the rel attribute with a value of "stylesheet" to indicate that the linked resource is a style sheet.
  • The type attribute specifies the type of the linked resource. This attribute is not always required, as the browser can often infer the type of the linked resource based on the file extension or MIME type.

Here is an example of how to use the link tag in HTML:

1<!DOCTYPE html>
2<html>
3  <head>
4    <title>My Website</title>
5    <link rel="stylesheet" href="styles.css">
6  </head>
7  <body>
8    <h1>Welcome to my website</h1>
9    <p>This is some sample text.</p>
10  </body>
11</html>

In this example, we've used the link tag to link an external style sheet to our HTML document. We've set the rel attribute to "stylesheet" to indicate that the linked resource is a style sheet, and we've set the href attribute to "styles.css" to indicate the location of the style sheet. When we view this HTML in a web browser, the browser will use the styles in the linked style sheet to style the HTML document.

The link tag can also be used to link to other resources, such as scripts or images. For example, you can use the link tag to link to a JavaScript file like this:

1<link rel="script" href="script.js">

Or you can use the link tag to link to an image file like this:

1<link rel="image" href="image.jpg">