Est-il possible de rendre une balise d'ancrage HTML non cliquable / liable à l'aide de CSS?

Par exemple si j'ai ceci:

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

Y a-t-il quelque chose que je puisse utiliser pour l'attribut style qui fera en sorte que le lien ne soit pas cliquable et ne me mènera pas à page.html?

Ou, est-ce que ma seule option consiste simplement à ne pas envelopper le «lien de page» dans une balise d'ancrage?

Edit: Je veux expliquer pourquoi je veux faire cela afin que les gens puissent être en mesure de fournir de meilleurs conseils. J'essaie de configurer mon application afin que le développeur puisse choisir le type de style de navigation qu'il souhaite.

Donc, j'ai une liste de liens et l'un est toujours actuellement sélectionné et tous les autres ne le sont pas. Pour les liens qui ne sont pas sélectionnés, je souhaite évidemment que ceux-ci soient des balises d'ancrage cliquables normales. Mais pour le lien sélectionné, certaines personnes préfèrent que le lien reste cliquable tandis que d'autres préfèrent le rendre non cliquable.

Maintenant, je pourrais facilement simplement ne pas envelopper de balises d'ancrage autour du lien sélectionné. Mais je pense que ce sera plus élégant si je peux toujours envelopper le lien sélectionné dans quelque chose comme:

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

puis laissez le développeur contrôler le style de liaison via CSS.

Vous pouvez utiliser ce css:

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

Et puis attribuez la classe à votre code html:

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

Cela rend le lien non cliquable et le style du curseur est une flèche, pas une main comme le font les liens.

ou utilisez ce style dans le html:

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

mais je suggère la première approche.

Ce n'est pas trop facile à faire avec CSS, car ce n'est pas un langage comportemental (c'est-à-dire JavaScript), le seul moyen simple serait d'utiliser un événement JavaScript OnClick sur votre ancre et de le renvoyer comme faux, c'est probablement le code le plus court vous pouvez utiliser pour cela:

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

Oui .. Il est possible d' utiliser le CSS

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

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

Ou purement HTML et CSS sans événements:

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

CSS a été conçu pour affecter la présentation, pas le comportement.

Vous pouvez utiliser du JavaScript.

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

Une manière plus discrète (en supposant que vous utilisez jQuery):

HTML:

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

Javascript:

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

L'avantage de ceci est la séparation nette entre la logique et la présentation. Si un jour vous décidez que ce lien ferait autre chose, vous n'avez pas à vous soucier du balisage, juste du JS.

La réponse est:

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

Cela peut être fait en css et c'est très simple. changez le "a" en "p". Votre "lien de page" ne mène de toute façon pas à quelque part si vous voulez le rendre non cliquable.

Lorsque vous dites à votre css de faire une action de survol sur ce "p" spécifique, dites-lui ceci:

(pour cet exemple, j'ai donné au "p" l'identifiant "exemple")

#example
{
  cursor:default;
}

Maintenant, votre curseur restera le même que sur toute la page.

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