Page 59 - Code & Click - 8

WORKING WITH HYPERLINKS
A hyperlink or link, is a word, phrase or an image that stores the
address of some other web page or document. It enables you to
navigate from one topic to the next topic on the same web page or
from one web page to another. When you click on any link, the linked
document gets opened.
A link is usually underlined and in a different colour from the normal
text. When you move the mouse pointer over a link, it changes from
an arrow pointer to a hand pointer.

Types of Links
Links are of three types:

• Internal Link: An internal link links to a certain section on the same web page. It lets you
navigate quickly to a desired section on a long web page.
• External Link: An external link links two different web pages. When you click an external link,
the linked web page gets displayed in the browser window.
• Email Link or Mailto Link: An email link enables you to send email to a predefined email
address using an email program.

Creating a Link
Anchor Tag <a>...</a>
HTML provides the anchor <a> tag to create links in a web page. This tag is a container tag, and is
closed by </a> tag.
The HREF (hypertext reference) attribute of the <a> tag stores the reference (address) of the
document that is to be linked. The text that appears on the link is enclosed between the starting tag
<a> and ending tag </a>.
Syntax : <a href= “Document name”> Hyperlink Text </a>
Styling Links
You can control the appearance of links throughout your web pages using CSS. Links can be styled
differently depending on their state. The four link states are – unvisited, hover, active, and visited.

Unvisited The default state of a link on a web page that has not been visited yet. It can be styled
by using the a:link property in CSS.
Hover The state of a link with a mouse pointer over it. It can be styled by using the a:hover
property in CSS.

Active The state of a link when it is clicked. It can be styled by using the a:active property in CSS.

Visited The state a link after it has been visited. It can be styled by using the a:visited property
in CSS.

Knowledge Discovery Subject Enrichment

The a:hover property must be set after the a:link property, while the a:active and a:visited properties must
be set after the a:hover property.

57