How to disable a link using only CSS?

Spread the love

Sometimes, we want to disable a link using only CSS.

In this article, we’ll look at how to disable a link using only CSS.

How to disable a link using only CSS?

To disable a link using only CSS, we set the pointer-events CSS property to none.

For instance, we write

<a href="#" class="disabled">link</a>

to add the a element.

Then we write

.disabled {
  pointer-events: none;
  cursor: default;
  opacity: 0.6;
}

to set pointer-events to none to disable the link.

Conclusion

To disable a link using only CSS, we set the pointer-events CSS property to none.

Leave a Reply

Your email address will not be published.