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 & 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
= New in HTML5.
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.
An image as a link
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 a mailto link
How to link to a mail message (will only work if you have mail installed).
Create a mailto link 2
Another mailto link.
Link to
an element with a specified id
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);
}
| 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 |
| rel | alternate author bookmark help license next nofollow noreferrer prefetch 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 |