Anchors elements are used to link multiple HTML documents. It requires only one tag viz., the <A> tag. It occurs only in the body of an HTML document. If an anchor is used to turn text into a hyperlink, the text is usually colored blue and underlined.
Syntax <a href=" "> content </a>If you want to create a hyperlink which will take the user to a different page href or hypertext reference is mandatory. For without it, the anchor will not function as a hyperlink.
Hyperlinks can be of two type:
(1) Links to an external document
(2) Links to a specified place within the same document.
We’ll be covering the following topics in this tutorial:
External Document References
It links the source document to a specific external document.
Example <ahref="main.htm"> Home </a>Here “HOME” becomes a hyperlink and links to another document. “Main.htm” which is present in the current working directory. If the file is not present in the current directory a relative or absolute path can be specified.
By default a hyper link takes a user to the beginning of the new web page. At times it might be necessary to jump to a particular location within the new web page. To enable a jump to a specific location in a web page, Named Anchors can be set up.
Named Anchors
Named Anchors are used to create links to a specific location within a page Jumping to a particular location on a web page can be summarized in two steps.
Step 1 : Mark the location to be jumped to i.e. identify the location in a web page to jump to by giving the location a name. The “Name” attribute of <A> tag does this
Syntax <a Name="Location-name">
Example: <a Name="location1">
This identifies to jump at location l
Step 2: While jumping to a specific web page and a specific location on the web page, in addition to the name of the web page to be jumped to, the name of the location on the web page to go to is required.
A web page will really be contained in an HTML file. Hence the web page to jump to really requires a filename. ·htm, together with the name of the location to jump to in the HTML file. This is done as follows;
Syntax <a href="file_name. Htm # location_name"> </a>Example:
<A href= “Main.htm # location 1″ > Home </ A> Home becomes a hotspot and leads to a location named location 1” in the file “Main.htm”. The following lines of code show the use of external links:
Main Document
<html>
<head><title>external links </title></head>
<booy>
<h2><p>discover more about dreamweaver 4 </p></h2>
<a href="d:\code\lntro\dll.htm#one">what's new in dreamweaver 4 <a><br><br>
<a href="d:\code\ol 1.htm#two">dreamweaver web site </a><br><br>
<a href="d:\code\ol2. htm#three">dreamweaver exchange</ a><br><br>
<a href="d:\code\ol3.htm#four">release notes</a><br><br>
</body>
</html>
Code of Referenced Document
<html> <head><title> text fields</title></head>
<bodybgcolor="pink">
<aname="one">
<h2> new in dreamweaver4</h2>It highlights the exciting new features included in this release. Thanks to people like you, Macromedia Dreamweaver has become the standard solution for professional web development on both the Windows and Macintosh platforms.
</booy>
</html>
As you can observe in the code of main document not only the document name (DLL.HTM) but also the name of the location (/fone”) to be referenced is mentioned. Also you will notice in the document (DLL.HTM) the heading “New in Dreamweaver 4” is given an identification number “one” respectively. So when one clicks on the highlighted portion say What’s New in Dreamweaver 4 in Figure the href attribute links the user to that part of the external page which is defined by <A NAME= “ONE”>. Similarly names of external files and their respective location name are specified for headings Dreamweaver Web Site, Dreamweaver Exchange and Release Notes.
Internal Document References
Sometimes a jump is required to a different location in the same document. For example at the bottom of a long page you can provide a link to the top by using named anchor. Now the visitor won’t need to scroll the entire page and can jump directly to the top by just using a mouse click.
Since the jump has to be targeted to a specific location the same two steps need to be performed as before i.e. identify a location with a name and then jump to that location using the name. The only difference is that the file name. ·htm now will be the current file name.htm
Syntax: <a NAME="location-name/">
<a href="#location_name"............</a>
The absence of the filename ·htm before the # symbol indicates that a jump is required within the same document.
Example <a NAME="location 1">
<a href="#location1"> Home </a>
Home becomes a hotspot and leads to a location named location1 in the same Document.
Dinesh Thakur holds an B.C.A, MCDBA, MCSD certifications. Dinesh authors the hugely popular