¿Es posible hacer que una etiqueta de anclaje HTML no sea cliqueable / enlazable usando CSS?

Por ejemplo si tengo esto:

<a style="" href="page.html">page link</a>

¿Hay algo que pueda usar para el atributo de estilo que haga que el enlace no sea cliqueable y no me lleve a page.html?

¿O es mi única opción simplemente no envolver 'enlace de página' en una etiqueta de anclaje?

Editar: Quiero decir por qué quiero hacer esto para que las personas puedan brindar mejores consejos. Estoy tratando de configurar mi aplicación para que el desarrollador pueda elegir qué tipo de estilo de navegación quiere.

Entonces, tengo una lista de enlaces y uno siempre está seleccionado actualmente y todos los demás no. Para los enlaces que no están seleccionados, obviamente quiero que sean etiquetas de anclaje clicables normales. Pero para el enlace seleccionado, algunas personas prefieren que el enlace siga siendo cliqueable, mientras que a otros les gusta hacer que no sea cliqueable.

Ahora podría fácilmente no programar mediante programación las etiquetas de anclaje alrededor del enlace seleccionado. Pero creo que será más elegante si siempre puedo envolver el enlace seleccionado en algo como:

<a id="current" href="link.html">link</a>

y luego deja que el desarrollador controle el estilo de enlace a través de CSS.

Puedes usar este CSS:

.inactiveLink {
   pointer-events: none;
   cursor: default;
}

Y luego asigne la clase a su código html:

<a style="" href="page.html" class="inactiveLink">page link</a>

Hace que el enlace no sea cliqueable y el cursor estilo una flecha, no una mano como los enlaces tienen.

o use este estilo en el html:

<a style="pointer-events: none; cursor: default;" href="page.html">page link</a>

pero sugiero el primer acercamiento.

Eso no es demasiado fácil de hacer con CSS, ya que no es un lenguaje de comportamiento (es decir, JavaScript), la única forma fácil sería usar un evento OnClick de JavaScript en su ancla y devolverlo como falso, este es probablemente el código más corto podrías usar para eso:

<a href="page.html" onclick="return false">page link</a>

Sí. Es posible usando CSS

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

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

O simplemente HTML y CSS sin eventos:

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

CSS fue diseñado para afectar la presentación, no el comportamiento.

Podrías usar JavaScript.

document.links[0].onclick = function(event) {
   event.preventDefault();
};

Una forma más discreta (suponiendo que use jQuery):

HTML:

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

Javascript:

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

La ventaja de esto es la separación limpia entre lógica y presentación. Si un día decide que este enlace haría otra cosa, no tiene que meterse con el marcado, solo el JS.

La respuesta es:

<a href="page.html" onclick="return false">page link</a>

Se puede hacer en CSS y es muy simple. cambie la "a" por una "p". Su "enlace de página" no conduce a ningún lado de todos modos si desea que no se pueda hacer clic.

Cuando le diga a su CSS que haga una acción de desplazamiento sobre esta "p" específica, dígale esto:

(para este ejemplo le he dado a la "p" la identificación del "ejemplo")

#example
{
  cursor:default;
}

Ahora su cursor se mantendrá igual que en toda la página.

<a href="page.html" onclick="return false" style="cursor:default;">page link</a>