The anchor tag < a > can be used to:

The tag (anchor tag) in HTML is used to create a hyperlink on the webpage. This hyperlink is used to link the webpage to other web pages or some section of the same web page. It’s either used to provide an absolute reference or a relative reference as its “href” value.

Syntax: 

 Link Name 

Attribute: The anchor tag contains many attributes which are listed below.

Example 1: In this example, the GeeksforGeeks HTML Tutorial page will open when you click on the GeeksforGeeks HTML Tutorial link.

HTML

Output:

The anchor tag < a > can be used to:

HTML tag

Example 2: In this example, we simply redirect from the GeeksforGeeks to the Geeksforgeeks page.

HTML

<html>

<body>

  <h2>

    Welcome to

      GeeksforGeeks

    a>

  h2>

  <h2>This is anchor Tagh2>

body>

html>

Output: 

The anchor tag < a > can be used to:

Redirecting the linked text to the site using tag

Example 3: In this example, we will use an image to redirect to the Geeksforgeeks page.

HTML

Output:

The anchor tag < a > can be used to:

Redirecting the linked image to website using HTML tag

Example 4: In this example, we see how an anchor tag can be used to link different sections on the same web page using href attribute and id selector.

HTML

<html>

<head>

    <title>Example 4title>

head>

<body>

    <div class="nav">

<p>GeeksforGeeksp>

        <ul>

            <li><a href="#section1" class="btn">Section 1a>li>

            <li><a href="#section2" class="btn">Section 2a>li>

            <li><a href="#section3" class="btn">Section 3a>li>

            <li><a href="#section4" class="btn">Section 4a>li>

            <li><a href="#section5" class="btn">Section 5a>li>

            <li><a href="#section6" class="btn">Section 6a>li>

            <li><a href="#section7" class="btn">Section 7a>li>

            <li><a href="#section8" class="btn">Section 8a>li>

            <li><a href="#section9" class="btn">Section 9a>li>

            <li><a href="#section10" class="btn">Section 10a>li>

        ul>

    div>

    <div class="sections" id="section1">

        Section 1

    div>

    <div class="sections" id="section2">

        Section 2

    div>

    <div class="sections" id="section3">

        Section 3

    div>

    <div class="sections" id="section4">

        Section 4

    div>

    <div class="sections" id="section5">

        Section 5

    div>

    <div class="sections" id="section6">

        Section 6

    div>

    <div class="sections" id="section7">

        Section 7

    div>

    <div class="sections" id="section8">

        Section 8

    div>

    <div class="sections" id="section9">

        Section 9

    div>

    <div class="sections" id="section10">

        Section 10

    div>

body>

html>

CSS

 * {

     margin: 0px;

     padding: 0px;

 }

 .nav {

     height: 250px;

     width: 250px;

     text-align: center;

     background-color: green;

     color: whitesmoke;

     font-size: 18px;

 }

 p {

     font-size: 28px;

 }

 ul {

     list-style: none;

 }

 a:hover {

     color: whitesmoke;

 }

 .sections {

     width: 12vw;

     height: 15vh;

     background-color: #7EC8E3;

     font-size: 25px;

     color: white;

     text-align: center;

     margin: 8px 5px;

 }

 .sections:nth-of-type(2n) {

     background-color: #FB4570;

 }

Output :

The anchor tag < a > can be used to:

Redirecting to different section on the same page

Supported Browsers: 

  • Google Chrome
  • Internet Explorer
  • Firefox
  • Opera
  • Safari
  • Microsoft Edge 12 and above

What attribute is used with an anchor a element to specify the name of the browser window that will hold the hyperlinked content?

What is an on page anchor HTML?

An anchor is a piece of HTML code that is used as a bookmark to create a link to a particular section within a page.