Come disattivare un link html con CSS

Vi sarà capitata la necessità di far "scomparire" un link inserito nel codice html di una pagina in modo che l'utente non possa cliccare sul link, ma nello stesso tempo conservare il link all'interno del codice html, magari perché non potete rimuoverlo nel codice o perché vi torna comodo mantenerlo per altri motivi. C'è un modo molto semplice attraverso istruzioni nel CSS, senza modificare il file html.

Sono sufficienti due sole istruzioni

cursor: default; serve per togliere la "manina" dal cursore e mettere la freccia standard
pointer-events: none; elimina l'interazione con il link e non fa visualizzare nemmeno il "title" eventualmente assegnato al link

Provate, è semplice ed efficace!

Potete assegnare le istruzioni CSS a un link <a> con una classe o a un link contenuto in un <div> oppure in un altro tag html. Ecco alcuni esempi:


Vengono disattivati tutti i link "a" contenuti in un "div" con classe "contenitore"
div.contenitore a {
cursor: default;
pointer-events: none;
}

Vengono disattivati tutti i link "a" con classe "disattivare"
a.disattivare {
cursor: default;
pointer-events: none;
}

Vengono disattivati tutti i link "a" con classe "disattivare" contenuti in un "p" con classe "contenitore"
p.contenitore a.disattivare {
cursor: default;
pointer-events: none;
}

Richiedi i nostri prodotti

Vorresti un sito web? Contattaci

Questo sito web non utilizza cookies ed è realizzato in puro codice html.
È un bel risparmio ogni anno non dover pagare la gestione della cookies policy. Senza contare che il sito è velocissimo!
Ne vuoi anche tu uno così? Contattaci!

Copyright © 2012-2024 DecadeWeb di Fabio Pin. All Rights Reserved. P.IVA 02701370302