HTML a tag
Example
Create a link to Programming Infinity.com:
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
Tips and Notes
Tip: If the <a> tag has no href attribute, it is only a placeholder for a hyperlink.
Tip: A linked page is normally displayed in the current browser window, unless you specify another target.
Attributes
| Attribute | Value | Description |
|---|---|---|
| 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 |
| 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 same-origin strict-origin-when-cross-origin unsafe-url |
Specifies which referrer information to send with the link |
| 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 |
| target | _blank _parent _self _top |
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.
More Examples
Example
How to use an image as a link: Add the image inside the <a> tag.
<img border="0" alt="PI" src="pi.jpg" width="100" height="100">
</a>
Example
How to open a link in a new browser window: Add target of the <a> tag to "_blank".
Example
How to link to an email address: Add e-mail address to href attribute with mailto: as prefix.
Example
How to link to a phone number: Add phone number to href attribute with tel: as prefix.
Example
How to link to another section on the same page: Add #section_id to the href attribute. The section id is the id of the element, where we want to go on the same web page.
Example
How to link to a JavaScript: Add javascript function in single line with javascript: as prefix to the href attribute.
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);
}
Comments
Post a Comment