Page 84 - Computer - 8
P. 84
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>
The following examples illustrate the use of anchor <a> tag to create different types of links.
To create a link to an HTML document present in the same location (directory) as the current document,
the code is
<a href = “Details.html”> Click for details </a>
To create a link to a HTML document on the WWW, the code is
<a href = “http://www.office.microsoft.com”> Microsoft Office Home Page </a>
To create a link to an email address, the code is
<a href = “mailto: gangaramprakashan@gmail.com”> Gangaram Prakashan </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.
82