Home » Learn » HTML Tutorial » HTML Links

HTML Links

Links are used to connect multiple HTML pages.

A Website is a collection of web pages and these web pages are connected with each other using HTML links. User can visit one page to another HTML web page by clicking on the links.

More Information About Links:

  • HTML links are also called Hyperlinks.
  • Link can be in the form of text as well as images or other media
  • You can provide a link to any section of the same page, any other page within a website or any external website as well.

HTML Links Syntax

We can create HTML links using anchor <a> tag.
For example: <a href="http://www.tutorialsclass.com"> Tutorials Class </a>

The href attribute is used to specify link address of the web page. The text between the anchor tags “Tutorials Class” is visible to the user. User can click on this and it will take you to the another page.

Example of HTML Link using anchor tag:

<html>
<body>
 
<a href="http://tutorialsclass.com" target="_blank">Go to Tutorials Class</a> 
 
</body>
</html>

Type of Link URLs:

Absolute URLs: These are full address to the destination page/link.
Example of Absolute URL is: <a href="http://www.tutorialsclass.com/page1.html"> Page 1 Link </a>

Relative URLs: A relative URL links to a file in relation to the present directory.

For example, if you want to create a link on “page1.html” to “page2.html” and both files in same folder, you can simply provide file name in href. It is called the relative URL.
Example of Relative URL: <a href="page2.html"> Page 2 Link </a>

HTML Links Target:

We can set HTML Links Target to open into the new window or same window. The target attribute is used with one of the following values:

Example of HTML Target Attribute: <a href="page2.html" target="_top"> Link with New Window </a>

HTML Target Attribute Values List

Target ValuePurpose
_blankIt opens linked page in a new window or tab
_selfIt opens linked page in the same window/tab in which we clicked on link. (This is default link target)
_parentIt opens linked page in the parent frame
_topIt opens linked page in the full body of the window
framenameIt opens linked page in a named frame

Complete Example of HTML Links

Let us create two files “page1.html” & “page2.html”. We will create a link between these two files using relative URL. We will also test a link using absolute url as well.

Create a HTML file “page1.html” and write following code:

<html>
<body>
 
<a href="page2.html" >Example of Relative Link</a> 
 
<a href="http://tutorialsclass.com" target="_blank">Example of Absolute Link</a> 
 
</body>
</html>

Create a HTML file “page2.html” and write following code: 

<html>
<body>
 
<a href="page1.html">Example of Relative Link</a> 
 
<a href="http://google.com" target="_blank">Example of Absolute Link</a> 
 
</body>
</html>

Share this post:

Share on LinkedIn
Congratulations! Chapter Finished. Learn more about the similar topics:
Exercises & Assignments
No Content Found.
Interview Questions & Answers
No Content Found.