Lecture-6 : HTML LINKS

Hyperlinks :- A string or a clickable graphic that points tot another web page or document. When the hyperlink is selected, another web page is requested, retrieved , and rendered by the browser

Hypertext :- Web pages that have hyperlinks to the other pages are called hypertext. More generally, any text having non-linear links to other text.

The Unvisited hyperlinks appear in blue color and the color of Active link is red. After the hyperlink has been activated or visited its color is changed to purple.

Definitions and Usage
In HTML, links are defined with the <a> tag.

The <a> tag defines a hyperlink, which is used to link from one page to another.

Syntax:-
<a href=”url”>text</a>

Example:

Hyperlinks to websites
<a href =”http://www.care4you.in/index.htm”>Visit our site</a>

Local Links
<a href=”page2.html”>go to secont page</a>


HTML Links – Target Attribute

The target attribute specifies where to open the linked document

<a href =”http://www.care4you.in/index.htm” target=”_blank”>Visit our site</a>

Making Images as Links


<a href=”page2.html”><img src=”img1.jpg”></a>

If page2.html is placed in another folder named “SubFolder”. Then Follow this example

<a href=”SubFolder/page2.html”>The HTML File is placed in another Folder</a>

In another way if you are in page2.html and want to go on the html page named (page1.html) placed in previous folder. Then this example will help you

<a href=”../page1.html”>HTML file is placed in the previous folder</a>

INTERNAL LINKING

You can also create internal links within a page - for example a table of contents at the top with links to each chapter below. All you need to use is a very useful attribute called id (identification) and the symbol #.

<html>

<head>
<title>HTML internal Linking</title>
</head>

<body>

<p><a href="#heading1">Link to heading 1</a></p>
<p><a href="#heading2">Link to heading 2</a></p>

<h1 id="heading1">heading 1</h1>
<p>Enter your text here........................</p>

<h1 id="heading2">heading 2</h1>
<p>Enter your text here........................</p>

</body>

</html>


MAKING LINK TO AN EMAIL ADDRESS

The only difference between a link to an e-mail and a link to a file is that instead of typing the address of a document, you type mailto: followed by an e-mail address. When the link is clicked, the default e-mail program opens with a new blank message addressed to the specified e-mail address. Please note that this function will only work if there is an e-mail program installed on your computer

For Example:-

<a href="mailto:info@care4you.in">Send an e-mail to info@care4you.in</a>