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 arrow will turn into a little hand.
Note: A link does not have to be text. It can be an image or any other HTML element.
HTML Links - Syntax
Hyperlinks are defined with the HTML
href attribute specifies the destination address (https://www.w3schools.com/html/)
of the link.
The link text is the visible part (Visit our HTML tutorial).
Clicking on the link text will send you to the specified address.
Note: Without a forward slash at the end of subfolder addresses, you might generate two requests to the server. Many servers will automatically add a forward slash to the end of the address, and then create a new request.
The example above used an absolute URL (a full web address).
A local link (link to the same web site) is specified with a relative URL (without https://www....).
HTML Links - The target Attribute
target attribute specifies where to open the linked document.
target attribute can have one of the following values:
_blank- Opens the linked document in a new window or tab
_self- Opens the linked document in the same window/tab as it was clicked (this is default)
_parent- Opens the linked document in the parent frame
_top- Opens the linked document in the full body of the window
- framename - Opens the linked document in a named frame
This example will open the linked document in a new browser window/tab:
Tip: If your webpage is locked in a frame, you can use
target="_top" to break out of the frame:
HTML Links - Image as a Link
It is common to use images as links:
<img src="smiley.gif" alt="HTML tutorial" style="width:42px;height:42px;border:0;">
border:0; is added to prevent IE9 (and earlier) from displaying a border around the image
(when the image is a link).
Button as a Link
title attribute specifies extra information about an element.
The information is most often shown as a tooltip text when the mouse moves over the element.
External pages can be referenced with a full URL or with a path relative to the current web page.
This example uses a full URL to link to a web page:
This example links to a page located in the html folder on the current web site:
This example links to a page located in the same folder as the current page:
You can read more about file paths in the chapter HTML File Paths.
- Use the
<a>element to define a link
- Use the
hrefattribute to define the link address
- Use the
targetattribute to define where to open the linked document
- Use the
<img>element (inside <a>) to use an image as a link
HTML Link Tags
|<a>||Defines a hyperlink|
For a complete list of all available HTML tags, visit our HTML Tag Reference.