How to make page links in HTML Page?


A link is a connection from one Web page to another web page.

We can add page links to a web page. HTML links are hyperlinks. The <a> tag defines a hyperlink and is used to link from one page to another. The href attribute is used with the <a> tag, which indicates the link's destination.

To create page links in an HTML page, we need to use the href attribute of the <a> and </a> tag. Make sure that the <a></a> tag is placed with in the <body>…</body> tags.

The link text is visible. Clicking on the link text will navigate to the specified URL address. By default, links will appear as follows on the web page of the browser.

  • An unvisited link is underlined and blue

  • A visited link is underlined and purple

  • An active link is underlined and red

Syntax

Following is the syntax to make a page link on the web page.

<a href="https://www.Google.com/"> text of the link </a>

Example

Following example program to make a page link on the web document.

<!DOCTYPE html> <html> <body> <h1>HTML Article on Links </h1> <p><a href="https://www.Google.com/">Click this to navigate to the Google home page</a></p> </body> </html>

Following is the output for the unvisited link. When we click on the link it will navigate us to the home page of the google search engine. Thus, the link will get visited and appear underlined and purple.

Example

In the example below, we linked the official page of tutorialspoint on the web document.

<!DOCTYPE html> <html> <head> <title>HTML Links</title> </head> <body> <h1>Click the link below and navigate the official page of tutorialspoint</h1> <a href="https://www.tutorialspoint.com/index.htm">TUTORIALSPOINT</a> </body> </html>

If we click on the link it will redirect you to the destination page. When we click on the link it will navigate us to the home page of the webpage of tutorialspoint.

Using an image as a Hyperlink

We can add an image as link and other HTML elements as a link.

Syntax

Following is the syntax to add an image as a link on the web page.

<a href="link address"><img src="image destination"></a>

Example

Following is the example program to make an image as a link.

<!DOCTYPE html> <html> <body> <h1>HTML Article on Links </h1> <p><a href="https://www.Google.com/"><img src="https://www.tutorialspoint.com/javafx/images/javafx-mini-logo.jpg" style="width:50px;height:50px;"></a></p> </body> </html>

Following is the output for the image as a link, clicking on the image will navigate us to the google home page.

Updated on: 01-Sep-2023

80K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements