The
<a>tag, also known as the anchor tag, is used to create hyperlinks in HTML.
It allows users to navigate between web pages, jump to specific sections, download files, or even send emails usingmailto:links.
It is one of the most important elements for web navigation and interconnectivity.
Syntax
<a href="URL">Link Text</a>Attributes
| Attribute | Description |
|---|---|
href | Specifies the destination URL or resource to link to. |
target | Defines where to open the linked document (_self, _blank, _parent, _top). |
title | Displays additional information when the user hovers over the link. |
download | Instructs the browser to download the linked file instead of navigating to it. |
rel | Specifies the relationship between the current document and the linked document (e.g., nofollow, noopener, noreferrer). |
id | Unique identifier for the link. |
class | CSS class for styling the link. |
style | Inline CSS styling for the link. |
Example
<!DOCTYPE html>
<html>
<head>
<title>Anchor Tag Example</title>
<style>
a {
color: #29AB87;
text-decoration: none;
font-weight: bold;
}
a:hover {
color: #1c7a63;
text-decoration: underline;
}
</style>
</head>
<body>
<h1>HTML <a> Tag Example</h1>
<p>
Visit our official website:
<a href="https://html5andcss3.org" target="_blank" title="Visit HTML5 and CSS3 Official Site">
HTML5 and CSS3
</a>
</p>
<p>
Download a sample PDF file:
<a href="/samples/sample.pdf" download="sample.pdf">Download PDF</a>
</p>
<p>
Send us an email:
<a href="mailto:info@html5andcss3.org">info@html5andcss3.org</a>
</p>
<p>
Jump to a section on this page:
<a href="#about">Go to About Section</a>
</p>
<h2 id="about">About Section</h2>
<p>This section explains the working of the anchor tag in HTML.</p>
</body>
</html>Output
Browser Output
Use our TryIt Editor to see the output.
Browser Support
 Chrome |  Firefox |  Edge |  Safari |  Opera |  IE9+ |
|---|---|---|---|---|---|
| ✅Yes | ✅Yes | ✅Yes | ✅Yes | ✅Yes | ✅Yes |
The links appear as clickable text, styled according to your CSS.
Hover effects, file download, and email actions work as expected.
Notes
- Always use
target="_blank"carefully — addrel="noopener noreferrer"for security. - The
<a>tag can link to internal elements using IDs (e.g.,href="#section"). - You can turn any element (like
<img>or<button>) into a link by wrapping it with<a>. - Use the
downloadattribute for files you want the user to save instead of opening. - mailto will only work on the device which has default mail client has been configured.
Conclusion
The <a> tag enables hyperlinking and navigation, connecting web pages, files, and resources seamlessly.
It is the backbone of web navigation, making content interactive and interconnected.
