All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

How To Disable Anchor Tag In HTML

Last Updated : Mar 11, 2024

How To Disable Anchor Tag In HTML

In this tutorial we will show you the solution of how to disable anchor tag in HTML, in HTML, there is an anchor tag which is used to create a link between webpages, html files, images, audio files and video files also. An anchor tag acts like a button or event.

Here, you see on browser on text that is placed between <a> and </a> tag. Its color is blue and underlined by default. You are able to customize its look as you want. But today here job is to make the anchor tag disabled.

Yes, it’s right you are also able to disable anchor tag in html. This concept is very less used. But as a developer you must have to know how to disable an anchor tag in html.

Step By Step Guide On How To Disable Anchor Tag In HTML :-

As, anchor tag is used to link files each other. There are many attributes that are used under this tag. If you want to know about its attributes then you must visit to our webpage, in which we define about the attributes of anchor tags.

Now, anchor tag is used to create a link between many types of files. You are able to use anchor tag anywhere in html, means in body tag.

Now, here today we show you how to disable anchor tag. We hope that you understand the article properly.

<!DOCTYPE html>
      <html>
        <head>
          <title> Title of the document<title>
<style>
    .isdisabled{
        cursor:not-allowed;
        pointer-events: none;
    }
</style>
<body>
    <a href="https://www.google.com" class="isdisabled">
        this is a link
    </a>
</body>
      </html>
  1. First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
  2. Secondly, the <html> tag is used to indicate the beginning of an HTML document.
  3. As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively. Here, we create a style tag before closing of head, which is described in next point.
  4. Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here. Here, in body tag, we create an anchor tag. You can create as much as you want.
  5. After this the all things remain same, but here we give it a class, which is used in style tag. With the help of class, we give it some CSS properties, first one used here is cursor with value not-allowed.
  6. This is used to show that the cursor is not allowed here. After this we use, pointer-events none, so that when we trying to click on this, nothing happens.
  7. At last, the <body> and <html> tags are closed with </body> and </html> respectively.

Conclusion :-

In conclusion, here we can say that our html code is a perfect example of use of anchor tag in html with disabled value. If you are a beginner and don’t know anything about html, css, etc.

Then you must learn from our articles because these are easy to understand and the pronunciation, written material is easy to remember. I hope this tutorial on how to disable anchor tag in HTML helps you.

Author Image About Amruta

Amruta is an Experienced web developer with 4 years for experience she completed her master's with MCA and passionate about programming Languages for creating technical contents like HTML, CSS, JavaScript, Java, Python, PHP, jQuery.

Follow Amruta On Linkedin 🡪