HTML Links

HTML links allow users to navigate between web pages by clicking text, images, or other elements. They are created using the anchor element and can link to internal pages, external websites, or email addresses.

On this page

HTML Links

Links are found in nearly all web pages. Links allow users to click their way from page to page.

HTML Links – Hyperlinks

HTML links are hyperlinks.

You can click on a link and jump to another document. When you move the mouse over a link, the mouse pointer usually changes to a hand.

Note: A link does not have to be text. A link can be an image or any other HTML element.

HTML Links – Syntax

The HTML <a> tag defines a hyperlink.

<a href="url">link text</a>

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

The link text is the visible part that users click.

Example

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

By default, links usually appear as follows:

  • An unvisited link is underlined and blue
  • A visited link is underlined and purple
  • An active link is underlined and red

Tip: Links can be styled with CSS to change their appearance.

HTML Links – The target Attribute

By default, a linked page opens in the same browser window or tab.

The target attribute specifies where to open the linked document.

  • _self – Opens the document in the same window or tab (default)
  • _blank – Opens the document in a new window or tab
  • _parent – Opens the document in the parent frame
  • _top – Opens the document in the full body of the window
<a href="https://www.w3schools.com/" target="_blank">Visit W3Schools!</a>

Absolute URLs vs. Relative URLs

An absolute URL is a full web address, including the protocol.

<a href="https://www.w3.org/">W3C</a> <a href="https://www.google.com/">Google</a>

A relative URL links to a page within the same website.

<a href="html_images.asp">HTML Images</a> <a href="/css/default.asp">CSS Tutorial</a>

Use an Image as a Link

To use an image as a link, place the <img> element inside the <a> element.

<a href="default.asp">   <img src="smiley.gif" alt="HTML tutorial" style="width:42px;height:42px;"> </a>

Link to an Email Address

Use mailto: inside the href attribute to create an email link.

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

Button as a Link

An HTML button can be used as a link with JavaScript.

<button onclick="document.location='default.asp'">HTML Tutorial</button>

Link Titles

The title attribute provides extra information, often shown as a tooltip.

<a href="https://www.w3schools.com/html/" title="Go to W3Schools HTML section"> Visit our HTML Tutorial </a>

More on Absolute and Relative URLs

<a href="https://www.w3schools.com/html/default.asp">HTML tutorial</a> <a href="/html/default.asp">HTML tutorial</a> <a href="default.asp">HTML tutorial</a>

Chapter Summary

  • Use the <a> element to define a link
  • Use the href attribute to define the link destination
  • Use the target attribute to control where the link opens
  • Use images or buttons as links when needed
  • Use absolute or relative URLs depending on the situation

HTML Link Tags

Tag Description
<a> Defines a hyperlink

HTML Links Examples (12)