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.
Similar Reads
HTML Tutorial HTML stands for HyperText Markup Language. It is the standard language used to create and structure content on the web. It tells the web browser how to display text, links, images, and other forms of multimedia on a webpage. HTML sets up the basic structure of a website, and then CSS and JavaScript
11 min read
HTML Introduction HTML stands for Hyper Text Markup Language, which is the core language used to structure content on the web. It organizes text, images, links, and media using tags and elements that browsers can interpret. As of 2025, over 95% of websites rely on HTML alongside CSS and JavaScript, making it a fundam
6 min read
HTML Editors An HTML Editor is a software application designed to help users create and modify HTML code. It often includes features like syntax highlighting, tag completion, and error detection, which facilitate the coding process. There are two main types of HTML editors: Text-Based Editors - Allow direct codi
5 min read
HTML Basics HTML (HyperText Markup Language) is the standard markup language used to create and structure web pages. It defines the layout of a webpage using elements and tags, allowing for the display of text, images, links, and multimedia content. As the foundation of nearly all websites, HTML is used in over
6 min read
HTML Comments HTML comments are used to add notes or explanations in the HTML code that are not displayed by the browser.They are useful for documenting the code, making it easier to understand and maintain.To add a comment, use the syntax <!-- your comment here -->. HTML<!-- This is a comment and will n
4 min read
HTML Elements An HTML Element consists of a start tag, content, and an end tag, which together define the element's structure and functionality. Elements are the basic building blocks of a webpage and can represent different types of content, such as text, links, images, or headings.For example, the <p> ele
5 min read
HTML Attributes HTML Attributes are special words used within the opening tag of an HTML element. They provide additional information about HTML elements. HTML attributes are used to configure and adjust the element's behavior, appearance, or functionality in a variety of ways. Each attribute has a name and a value
8 min read
HTML Headings HTML headings are used to define the titles and subtitles of sections on a webpage. They help organize the content and create a structure that is easy to navigate.Proper use of headings enhances readability by organizing content into clear sections.Search engines utilize headings to understand page
4 min read
HTML Paragraphs A paragraph in HTML is simply a block of text enclosed within the <p> tag. The <p> tag helps divide content into manageable, readable sections. Itâs the go-to element for wrapping text in a web page that is meant to be displayed as a distinct paragraph.Syntax:<p> Some Content...
5 min read
HTML Text Formatting HTML text formatting refers to the use of specific HTML tags to modify the appearance and structure of text on a webpage. It allows you to style text in different ways, such as making it bold, italic, underlined, highlighted, or struck-through. Table of ContentCategories of HTML Text FormattingLogic
4 min read