Introduction
This chapter demonstrate about the XHTML Link. Links are used to navigate from one page to another page and user can also make use of the hyper links. Following are the concepts covered.
- Hyper Links
- Adding Anchors
Description
Hyperlinks are the basic features in XHTML which are used to navigate from one page to another page. Now a days every activity like browsing, surfing, downloading depends on links only. Basically links are divided into two types they are listed below.
The Syntax of the Link as shown below.
[html]
<a href=”Destination URL”> Related Text. </a>
[/html]
The snippet below demonstrates to creating the hyper links and encapsulating with in the anchor tag as shown below.
[html]
<!DOCTYPE HTML>
<html>
<style>body{font-family:Verdana;}</style>
<body>
<a href="http://www.splessons.com">SPLessons </a>
is the most comprehensive web development website on the internet.
</body>
</html>
[/html]
Result
By running the above code in a preferred browser user can get the following output as shown in below image.
- Hyper Links The <link> element are used in the <head> element.
- Anchor Links The <a> elements are used in the <body> element.
Conceptual
figure
The Figure below demonstrates the XHTML Links how to give the links and how to give the Destination URL as shown below.
Description
Anchors are targeted for hyperlinks which are inside the document itself. which is an required component for websites, For example user wants to create web sites in which user need to navigate from one page to another page then user need to use the Anchor tags. The snippet below demonstrates the Anchor Tags.
[html]
<a id="anchorname">anchored text</a>
[/html]
Either user can also use
[html]
<div id="anchorname">anchored text</div>
[/html]
In order to make the hyperlink with in the page which is not necessary to specify its location. the code below demonstrates to Adding the Anchors as shown.
[html]
<!DOCTYPE HTML>
<html>
<style>body{font-family:Verdana;}</style>
<body>
<div id="c1"><p>Tutorials</p></div>
<p>SPlessons Tutorials.</p>
<p>Go back to <a href="http://www.splessons.com">SPLessons</a>.</p>
</body>
</html>
[/html]
Result
By running the above code in a preferred browser user can get the following output as shown in below image.
Link Attributes
Following are the links which contain some attributes used to define the links between the html document and the external sources.
Following are the some link tag attributes for the XHTML with values and its description.
- href Used to demonstrate the URL of the link.
- title Title is short description about the links.
- id Id is the unique identifier to the link.
- class Which is the combination of multiple attributes with same class names.
| Attribute | Value | Description |
|---|---|---|
| href | URL | Which specify linked document location. |
| media | media_query | Which specify linked document displayed device. |
| rev | reversed relationship | Which specify linked document and current document relationship. |
| type | media_type | Which specify linked document media type. |
| target | _blank _self _parent | Which specify where the linked document to be loaded. |
Key Points
- Hyperlinks are very core feature of html.
- Anchor Tags are very useful in webpages.