Anchor Tag

The anchor tag <a> is used to create hyperlinks in HTML, allowing users to navigate from one page to another or open external resources. It is typically used within the body of an HTML document.

Syntax

<a href="url"> Text </a>

href: This attribute specifies the URL or destination of the hyperlink. Text: This is the text or content that will be displayed as the hyperlink.

Code :

<!DOCTYPE html>
<html>
  <head>
    <title>Home</title>
  </head>
  <body>
    <h1>This is Homepage</h1>

    <a href="https://www.roadtocode.org/"> Click here to visit Road To Code </a>
  </body>
</html>

Output :

Code :

File Name : homepage.html

<!DOCTYPE html>
<html>
  <head>
    <title>Home Page</title>
  </head>
  <body>
    <h1>This is Home page</h1>
    <a href="./aboutpage.html"> Click here to visit about page </a>
    <br />
    <br />
    <a href="./contactpage.html"> Click here to visit Contact page </a>
  </body>
</html>

File Name : aboutpage.html

<!DOCTYPE html>
<html>
  <head>
    <title>About Page</title>
  </head>
  <body>
    <h1>This is About page</h1>
    <a href="./contactpage.html"> Click here to visit Contact page </a>
    <br />
    <br />
    <a href="./homepage.html"> Click here to visit home page </a>
  </body>
</html>

File Name : contactpage.html

<!DOCTYPE html>
<html>
  <head>
    <title>Contact Page</title>
  </head>
  <body>
    <h1>This is Contact page</h1>
    <a href="./homepage.html"> Click here to visit home page </a>
    <br />
    <br />
    <a href="./aboutpage.html"> Click here to visit about page </a>
  </body>
</html>

Output homepage.html

Output aboutpage.html

Output contactpage.html

Using Anchor Tag Open Mail Address :

Syntax

<a href="mailto: Mail"> Text </a>

Code :

<!DOCTYPE html>
<html>
  <head>
    <title>Anchor Tag</title>
  </head>

  <body>
    <a href="mailto:[email protected]"> Send mail to Suraj </a>
  </body>
</html>

Output :

Add a Clickable Telephone using Anchor Tag :

Syntax

<a href="tel: Number"> Text </a>

Code :

<!DOCTYPE html>
<html>
  <head>
    <title>Anchor Tag</title>
  </head>

  <body>
    <a href="tel:+918805803087"> click here to call us </a>
  </body>
</html>

Output :

Anchor Tag

Anchor Tag​

Anchor Tag