HTML Hyperlinks

HTML Hyperlinks allow users to click their way from page to page. You can click on a link and jump to another document.

HTML Hyperlinks Syntax

HTML <a> tag is used to define hyperlinks.

<a href=”target-url”>link text</a>

The href attribute specifies the destination address and the link text is the visible part.

HTML Hyperlinks Example

<a href=”http://www.tutorialsgenie.com/scripting/html-tutorial/”>HTML Tutorial</a>

Hyperlink Colors

You can set different colors for each state of the link. By default an unvisited link is underlined and blue, a visited link is underlined and purple and an active link is underlined and red.

Hyperlink Colors Example

a:link {
color: blue;
text-decoration: none;
}
a:visited {
color: pink;
text-decoration: none;
}
a:hover {
color: red;
text-decoration: underline;
}
a:active {
color: yellow;
text-decoration: underline;
}

Hyperlinks target Attribute

The target attribute specifies where to open the linked document which can be one of followings.
_blank – Opens the document in a new window or tab
_self – Opens the document in the same window/tab as it was clicked (this is default)
_parent – Opens the document in the parent frame
_top – Opens the document in the full body of the window

The target Attribute Example

<a href=”http://www.tutorialsgenie.com/scripting/html-tutorial/” target=”_blank”>Html Tutorial</a>

Hyperlink title Attribute

The title attribute specifies extra information about an element which is shown as a tooltip text when the mouse moves over the element.

Hyperlink title Attribute Example

<a href=”http://www.tutorialsgenie.com/scripting/html-tutorial/” title=”HTML tutorial for beginners”>Html Tutorial</a>