HTML href Attribute

The href attribute on an element defines the page or site to link to. The href value can be an internal URL or an external URL. Elements that accept this attribute include <a>, <area>, <link>, and <base>.

Example

#

An href attribute on an <a> element.
Clicking the link opens a page from an external site in a new browser tab.

Go to Wikipedia
Go to <a href="https://en.wikipedia.org/wiki/Main_Page" target="_blank">Wikipedia</a>

For additional details see our HTML anchor href Reference.


Using href

The href attribute specifies the URL or path of the linked page or resource.

It accepts any of these URLs:

  • absolute URL - link to a page on an external website or domain (e.g. https://wikipedia.com)
  • relative URL - link to an internal page on the same domain (with a shorter url)
  • anchor URL - link to an anchored section within the same page (with the # notation)

Syntax

<tagname href="URL" >

Values

#

Value Description
URL URL or path of the page or resource.

Elements that accept href

The following elements accept the href attribute.

Elements Description
<a> Specifies an anchor link -- see example above
<area> Creates a clickable area inside an image map.
<link> Adds a linked resource to the page.
<base> Sets all relative links base URL.

<area> with href

An <area> tag with an href attribute.

Computer Screen Keyboard Mouse
<img src="/img/html/computer-map.png" alt="Computer" usemap="#computermap">

<map name="computermap">
  <area shape="rect" coords="253,142,16,2" alt="Screen" 
        href="javascript:alert('Screen was clicked');">
  <area shape="rect" coords="262,218,0,156" alt="Keyboard" 
        href="javascript:alert('Keyboard was clicked');">
  <area shape="circle" coords="267,234,22" alt="Mouse" 
        href="javascript:alert('Mouse was clicked');">
</map>

For additional details see our HTML area href Reference.


<link> with href

A <link> tag with an href attribute.
The invisible link loads a stylesheet into the page which is then used to style a paragraph.

Styled using external css.

<link rel="stylesheet" href="/tutorial/style.css">

<p class="aliceblue">Styled using external css.</p>

For additional details see our HTML link href Reference.


<base> with href

A <base> tag with an href attribute.

<head>
  <base href="https://en.wikipedia.org/wiki/">
</head>

<nav>
  <a href="Vincent_van_Gogh">Vincent Van Gogh</a> <br />
  <a href="Henri_Matisse">Henri Matisse</a> <br />
  <a href="Paul_Cézanne">Paul Cézanne</a>
</nav>

For additional details see our HTML base href Reference.


Browser support

Here is when href support started for each browser:

Chrome
1.0 Sep 2008
Firefox
1.0 Sep 2002
IE/Edge
1.0 Aug 1995
Opera
1.0 Jan 2006
Safari
1.0 Jan 2003

You may also like



Guides