HTML <a> Tag

Definition and Usage

<a> The tag defines a hyperlink, used to link from one page to another page.

<a> The most important attribute of the element is href attribute, it indicates the destination of the link.

By default, links will be displayed as follows in all browsers:

  • The link that has not been visited is underlined and blue
  • The link that has been visited is underlined and purple
  • The link being visited is underlined and red

Tip:You may have noticed that the links on the CodeW3C.com site look very different from the default link appearance. You can use CSS Pseudo-classes Add complex and diverse styles to text hyperlinks.

See also:

HTML Tutorial:HTML Links

HTML DOM Reference Manual:Anchor Object

CSS Tutorial:Link Styles

Term Explanation

What is Hypertext?

Instance

Example 1

Create a link to codew3c.com:

<a href="https://www.codew3c.com">Visit codew3c.com!</a>

Try it yourself

Example 2

How to use an image as a link:

<a href="https://www.codew3c.com">
<img border="0" alt="W3School" src="w3logo.png" width="400" height="225">
</a>

Try it yourself

Example 3

How to open a link in a new browser window:

<a href="https://www.codew3c.com" target="_blank">Visit codew3c.com!</a>

Try it yourself

Example 4

How to link to an email address:

<a href="mailto:someone@example.com">Send email</a>

Try it yourself

Example 5

How to link to a phone number:

<a href="tel:+8613888888888">+86 138 8888 8888</a>

Try it yourself

Example 6

How to link to another part of the same page:

<a href="#section2">Go to Chapter 2</a>

Try it yourself

Example 7

How to link to JavaScript:

<a href="javascript:alert('Hello World!');">Execute JavaScript</a>

Try it yourself

Tips and comments

Tip:If the <a> tag does not have an href attribute, it is just a placeholder for a hyperlink.

Tip:The linked page is usually displayed in the current browser window unless you specify another target (using the target attribute).

Tip:Please use CSS settings to style the link:CSS Links and CSS Buttons.

Attribute

Attribute Value Description
download Filename Specifies what the target will be downloaded when the user clicks on the hyperlink.
href URL Specifies the URL of the page to which the link points.
hreflang Language code Specifies the language of the linked document.
media Media query Specifies for which type of media/device the linked document is optimized.
ping URL list Specifies a space-separated list of URLs. When the link is accessed, the browser will send a POST request with a ping payload (sent in the background). Usually 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 the reference information to be sent along 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 the linked document should be opened.
type Media type Specifies the media type of the linked document.

Global attributes

<a> The tag also supports Global attributes in HTML.

Event attributes

<a> The tag also supports Event attributes in HTML.

Default CSS settings

Most browsers will display the following default values: <a> Element:

a:link, a:visited {
  color: (internal value);
  text-decoration: underline;
  cursor: auto;

a:link:active, a:visited:active {
  color: (internal value);

Browser Support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support Support Support Support Support