In this post, we will learn how to disable a link using only CSS. We can also disable a link using JavaScript. If you do not want to use JavaScript for this. So how we can do this with CSS, we will learn in this post. 


How To Disable A Link Using Only CSS ?


Disable A Link Using Only CSS

To disable a link with CSS, we use  pointer-events  CSS property. The  none value of this property specify to disable a link. This property supported in all major browsers, like Google Chrome, Mozilla Firefox, Internet Explorer v11+ and Safari etc.


For better understanding let's see given below example:


<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>How To Disable A Link Using Only CSS ?</title>
<style>

#disableLink{
pointer-events: none;
text-decoration: none;
}

</style>
</head>
<body>

<a href="https://www.codexradar.com/" id="disableLink">Go To CodexRadar</a>

</body>
</html> code-box



Summary

In this post we learned how to disable a link using only CSS. You try to make it yourself. I hope you make. If you face any problem, then comment and tell us. Keep visiting the blog to read more similar posts.

Post a Comment

Previous Post Next Post