Is it possible to make an HTML anchor tag not clickable/linkable using CSS?

Question

For example if I have this:

page link

Is there anything I can use for the style attribute that

Answer 1

A more un-obtrusive way (assuming you use jQuery):

HTML:

<a id="my-link" href="page.html">page link</a>

Javascript:

$('#my-link').click(function(e)
{
    e.preventDefault();
});

The advantage of this is the clean separation between logic and presentation. If one day you decide that this link would do something else, you don't have to mess with the markup, just the JS.

Answer 2

Yes.. It is possible using css

<a class="disable-me" href="page.html">page link</a>

.disable-me {
    pointer-events: none;
}

Answer 3

Or purely HTML and CSS with no events:

<div style="z-index: 1; position: absolute;">
    <a style="visibility: hidden;">Page link</a>
</div>
<a href="page.html">Page link</a>