HTML <a> Tag
Example
A link to W3Schools.com:
<a href="https://www.w3schools.com">Visit W3Schools.com!</a>
Try it Yourself »
More "Try it Yourself" examples below.
Definition and Usage
The <a> tag defines a hyperlink, which is used to link from one page to another.
The most important attribute of the <a> element is the href attribute, which indicates the link's destination.
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
Browser Support
| Element | |||||
|---|---|---|---|---|---|
| <a> | Yes | Yes | Yes | Yes | Yes |
Tips and Notes
Tip: The following attributes: download, hreflang, media, rel, target, and type cannot be present if the href attribute is not present.
Tip: A linked page is normally displayed in the current browser window, unless you specify another target.
Tip: Use CSS to style links: CSS Links Tutorial and CSS Buttons Tutorial
Differences Between HTML 4.01 and HTML5
In HTML 4.01, the <a> tag could be either a hyperlink or an anchor. In HTML5, the <a> tag is always a hyperlink, but if it has no href attribute, it is only a placeholder for a hyperlink.
HTML5 has some new attributes, and some HTML 4.01 attributes are no longer supported.
Attributes
| Attribute | Value | Description |
|---|---|---|
| charset | char_encoding | Not supported in HTML5. Specifies the character-set of a linked document |
| coords | coordinates | Not supported in HTML5. Specifies the coordinates of a link |
| download | filename | Specifies that the target will be downloaded when a user clicks on the hyperlink |
| href | URL | Specifies the URL of the page the link goes to |
| hreflang | language_code | Specifies the language of the linked document |
| media | media_query | Specifies what media/device the linked document is optimized for |
| name | section_name | Not supported in HTML5. Use the global
id attribute instead. Specifies the name of an anchor |
| ping | list_of_URLs | Specifies a space-separated list of URLs to which, when the link is followed, post requests with the body ping will be sent by the browser (in the background). Typically used for tracking. |
| referrerpolicy | no-referrer no-referrer-when-downgrade origin origin-when-cross-origin unsafe-url |
Specifies which referrer to send |
| rel | alternate author bookmark external help license next nofollow noreferrer noopener prev search tag |
Specifies the relationship between the current document and the linked document |
| rev | text | Not supported in HTML5. Specifies the relationship between the linked document and the current document |
| shape | default rect circle poly |
Not supported in HTML5. Specifies the shape of a link |
| target | _blank _parent _self _top framename |
Specifies where to open the linked document |
| type | media_type | Specifies the media type of the linked document |
Global Attributes
The <a> tag also supports the Global Attributes in HTML.
Event Attributes
The <a> tag also supports the Event Attributes in HTML.
Try it Yourself - Examples
Create hyperlinks
How to create hyperlinks.
Create a
clickable image
How to use an image as a link.
Open a link in a new browser window
How to open a link in a new browser window, so that the visitor does not have to leave your Web site.
Create an
email link
How to link to a mail message (will only work if you have mail installed).
Create
another email link
Another mailto link.
Create a
phone link
How to link to a phone number.
Link to
another section on the same page
How to link to an element with a specified id within a page (the name attribute is not supported in HTML5).
Link to a JavaScript
How to add a JavaScript inside the href attribute.
Related Pages
HTML tutorial: HTML Links
HTML DOM reference: Anchor Object
CSS Tutorial: Styling Links
Default CSS Settings
Most browsers will display the <a> element with the following default values:
a:link, a:visited {
color: (internal value);
text-decoration: underline;
cursor: auto;
}
a:link:active, a:visited:active {
color: (internal value);
}
