HTML Links Hyperlinks

Last Updated : 17 Jun, 2025

HTML Links, also known as hyperlinks, are defined by the <a> tag in HTML, which stands for "anchor." These links are essential for navigating between web pages and directing users to different sites, documents, or sections within the same page.

The basic attributes of the <a> tag include href, title, and target, among others.

Basic Syntax of an HTML Link:

<a href="https://www.example.com">Visit Example</a>

Note: A hyperlink can be represented by an image or any other HTML element, not just text.

A Simple HTML Link Example

In this example, we contains a paragraph instructing users to click on the link labeled "GeeksforGeeks," which directs to the website "https://www.geeksforgeeks.org".

HTML

<!DOCTYPE html>
<html>

<head>
    <title>HTML Links</title>
</head>

<body>
    <p>Click on the following link</p>
    <a href="https://www.geeksforgeeks.org">
        GeeksforGeeks
    </a>
</body>

</html>

Output:

By default, links will appear as follows in all browsers:

An unvisited link is underlined and blue.
A visited link is underlined and purple.
An active link is underlined and red.

HTML Links - Target Attribute

The target attribute in the <a> tag specifies where to open the linked document. It controls whether the link opens in the same window, a new window, or a specific frame.

Attribute	Description
`_blank`	Opens the linked document in a new window or tab.
`_self`	Opens the linked document in the same frame or window as the link. (Default behavior)
`_parent`	Opens the linked document in the parent frame.
`_top`	Opens the linked document in the full body of the window.
`framename`	Opens the linked document in a specified frame. The frame’s name is specified in the attribute.

Example: In this example we demonstrates the use of target attributes in links. Each link opens in a different context: _blank opens in a new window or tab, _self in the same frame, _parent in the parent frame, _top in the full window body, and framename in a specified frame.

HTML

<!DOCTYPE html>
<html>

<head>
    <title>Target Attribute Example</title>
</head>

<body>
    <h3>
        Various options available in the
        Target Attribute
    </h3>

    <p>
        If you set the target attribute to
        "_blank", the link will open in a new
        browser window or tab.
    </p>
    <a href="https://www.geeksforgeeks.org" 
       target="_blank">
        GeeksforGeeks
    </a>

    <p>
        If you set the target attribute to
        "_self", the link will open in the
        same window or tab.
    </p>
    <a href="https://www.geeksforgeeks.org" 
       target="_self">
        GeeksforGeeks
    </a>

    <p>
        If you set the target attribute to
        "_top", the link will open in the full
        body of the window.
    </p>
    <a href="https://www.geeksforgeeks.org" 
       target="_top">
        GeeksforGeeks
    </a>

    <p>
        If you set the target attribute to
        "_parent", the link will open in the
        parent frame.
    </p>
    <a href="https://www.geeksforgeeks.org" 
       target="_parent">
        GeeksforGeeks
    </a>
</body>

</html>

Output

Linking Different HTML Elements

Below are examples of how to link different HTML elements with their respective code snippets

Element to Interlink	Specific Code
Linking to an image	`<a href="image.jpg"><img src="image.jpg" alt="Image"></a>`
Link to an Email Address	`<a href="mailto:[email protected]">Send Email</a>`
Phone Number	`<a href="tel:+1234567890">Call Now</a>`
Button	`<a href="https://www.example.com"> <button>Visit Example</button> </a>`
Link to Download File	`<a href="file.pdf" download>Download File</a>`
Link Title	`<a href="https://www.example.com" title="Visit Example">Link Text</a>`

Browser Support

Attribute
Hyperlinks	✓	✓	✓	✓	✓
Desktop	v1	v12	v1	v1	v15
Mobile	v18	–	v4	v1	v14

Note: "Desktop v1" indicates that the tag is supported from version 1 onwards in all subsequent released versions of the respective browser.

S

Shubrodeep Banerjee

Improve