Shine Tutorial    


HTML Links

« Previous Next Chapter »

A link is the "address" to a document (or a resource) on the web.


Try it - Examples

HTML links
This example demonstrates how to create links in an HTML document.

Open a link in a new browser window
This example demonstrates how to link to another page by opening a new window, so that the visitor does not have to leave your Web site.


Hyperlinks, Anchors, and Links

In web terms, a hyperlink is a reference (an address) to a resource on the web.

Hyperlinks can point to any resource on the web: an HTML page, an image, a sound file, a movie, etc.

An anchor is a term used to define a hyperlink destination inside a document.

The HTML anchor element <a>, is used to define both hyperlinks and anchors.

We will use the term HTML link when the <a> element points to a resource, and the term HTML anchor when the <a> elements defines an address inside a document..

An HTML Link

Link syntax:

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

The start tag contains attributes about the link.

The element content (Link text) defines the part to be displayed.

NB: The element content doesn't have to be text. You can link from an image or any other HTML element.

The href Attribute

The href attribute defines the link "address".

This <a> element defines a link to Shinetutorial:

<a href="">Visit Shine Tutorial!</a>

The code above will display like this in a browser:

Shine Tutorial Online Web Tutorials for all

The target Attribute

The target attribute defines where the linked document will be opened.

The code below will open the document in a new browser window:


<a href=""
target="_blank">Visit Shine Tutorial!</a>

Try it »

The name Attribute

When the name attribute is used, the <a> element defines a named anchor inside a HTML document.

Named anchor are not displayed in any special way. They are invisible to the reader.

Named anchor syntax:

<a name="label">Any content</a>

The link syntax to a named anchor: 

<a href="#label">Any content</a>

The # in the href attribute defines a link to a named anchor.


A named anchor inside an HTML document:

<a name="tips">Useful Tips Section</a>

A link to the Useful Tips Section from the same document: 

<a href="#tips">
Jump to the Useful Tips Section</a>

A link to the Useful Tips Section from another document:

<a href="">
Jump to the Useful Tips Section</a>



More Examples

An image as a link
This example demonstrates how to use an image as a link.

Link to a location on the same page
This example demonstrates how to use a link to jump to another part of a document.

Break out of a frame
This example demonstrates how to break out of a frame, if your site is locked in a frame.

Create a E-Mail to link
This example demonstrates how to link to a mail message (will only work if you have mail installed).

Link Tags

Tag Description
<a> Defines an anchor

« Previous Next Chapter »