HTML Tutorial

- HTML Global Attribute
- HTML Event Attributes

<link> Tag in HTML

The <link> tag in HTML is used to define the relationship between a document and an external resource. It is most commonly used to link to external style sheets, but it can also be used to link to other resources like icons or prefetching resources.

Key Points on <link> Tag:

The <link> tag is placed inside the <head> section of the HTML document.
It is a self-closing tag and does not have any content.
Commonly used for linking to external CSS files with the rel="stylesheet" attribute.
It can also be used for other relationships like icon, preload, and manifest.

Syntax of <link> Tag:

Syntax Example

<link rel="stylesheet" href="styles.css">

Example of <link> Tag in HTML:

This example demonstrates linking to an external CSS file for styling.

Code Example

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

Output

(Output will depend on the linked CSS file and its effects on the HTML document.)

Attributes of <link> Tag:

rel: Specifies the relationship between the current document and the linked resource (e.g., stylesheet, icon, preload).
href: Specifies the location of the external resource (e.g., a CSS file, icon, or font).
type: Specifies the media type of the linked resource (e.g., text/css for a stylesheet).
media: Specifies the media for which the linked resource is designed (e.g., screen, print).

The <link> tag is essential for linking external resources like CSS files, favicons, and more. It is always used within the <head> element to ensure proper loading before rendering the page. The href attribute should always point to a valid file path, and the rel attribute should define the appropriate relationship.