HTML Tags
HTML <a> Tag
The <a> (anchor) tag defines a hyperlink, the primary way to link one page or resource to another. Its href attribute holds the destination.
The <a> Tag
The <a> element creates a hyperlink to web pages, files, email addresses, phone numbers, or locations within the same page. The content between the opening and closing tags is the clickable link text or image.
The destination is set with the href attribute. By default a link is rendered as underlined blue text and is an inline element.
Syntax
Example
<a href="https://example.com">Link text</a>Example
Example
<!DOCTYPE html>
<html>
<body>
<p>Visit <a href="https://www.wikipedia.org/">Wikipedia</a> to learn more.</p>
<p>
<a href="https://picsum.photos/200" target="_blank">
Open a random image in a new tab
</a>
</p>
</body>
</html>More Examples
Example
<!DOCTYPE html>
<html>
<body>
<p><a href="mailto:hello@example.com">Email us</a></p>
<p><a href="tel:+919876543210">Call us</a></p>
<p><a href="#section2">Jump to Section 2 below</a></p>
<div style="height:600px"></div>
<h2 id="section2">Section 2</h2>
<p>You jumped here using an in-page anchor link.</p>
</body>
</html>Attributes
| Attribute | Description |
|---|---|
| href | The URL or fragment the link points to. |
| target | Where to open the link: _self (default), _blank, _parent, _top. |
| rel | Relationship of the target, for example noopener, nofollow, noreferrer. |
| download | Prompts the browser to download the linked resource. |
| title | Advisory text shown as a tooltip on hover. |
⚠️
When using target="_blank", also add rel="noopener noreferrer" to prevent the new page from gaining access to your page via window.opener.
Key Takeaways
- <a> creates hyperlinks; href sets the destination.
- It can link to pages, files, emails, phone numbers, and page sections.
- target="_blank" opens the link in a new tab.
- Pair _blank with rel="noopener noreferrer" for security.
- The download attribute triggers a file download.
