Come disabilitare un link usando solo CSS

Come disabilitare un link usando solo CSS
Ogni sito Web contiene molti collegamenti su ogni interfaccia che indirizzano l'utente ad altre pagine Web. Ad esempio, link per visitare qualche altro sito Web come riferimento durante la lettura di un post sul blog, visitare gli account di social media di un marchio mentre visitano i loro siti Web e scarica software per computer, ecc. Ma, se è necessario disabilitare un collegamento, viene utilizzata la proprietà dell'evento puntatore CSS.

Il seguente post spiegherà come la proprietà dell'evento puntatore viene utilizzata in un codice per disabilitare un collegamento in un documento HTML.

Disabilitazione di un collegamento usando CSS

La libreria CSS viene utilizzata in combinazione con altre lingue come HTML. Quindi, se un documento HTML ha un collegamento per visitare direttamente qualsiasi altra pagina Web, la proprietà CSS puntatore-event viene utilizzata per disabilitare un collegamento:

Event puntatore: nessuno;
Cursore: impostazione predefinita;

Come utilizzare la proprietà puntatore-eventi nel codice?

L'istruzione in stile CSS in cui aggiungeremo la proprietà puntatore-event per disabilitare il collegamento dovrebbe fare riferimento alla classe che contiene il collegamento. Ad esempio, se abbiamo una classe denominata "non-attiva" che contiene il collegamento:

Disabilita il collegamento usando CSS



Collegamento:
Clicca qui

Nel codice sopra, il collegamento cliccabile ha una classe "non-attiva" che verrà utilizzata per accedere a questo elemento HTML.

Il codice sopra genera il seguente output:

Facendo clic sul collegamento indirizza l'utente al motore di ricerca di Google:



La proprietà puntatore-evento

  • All'interno di un elemento in stile CSS, scrivi la proprietà dell'evento puntatore (Event puntatore: nessuno) mentre si riferisce alla classe (non-attivo) contenente il collegamento che dovrebbe essere disabilitato.
  • Imposta il cursore come una qualsiasi delle opzioni come predefinito, nessuna, puntatore, ecc.

Dopo aver eseguito il codice, non vi sarà alcuna modifica nella visualizzazione grafica del collegamento dall'esterno, ma quando l'utente lo fa clic, non farà nulla:

Questo era il modo più semplice per disabilitare il collegamento in un codice utilizzando le istruzioni CSS.

Conclusione

Un collegamento che indirizza l'utente ad altre pagine Web può essere facilmente disabilitato tramite una semplice proprietà CSS "puntatore-eventi: nessuna". Ciò non richiede alcuna modifica alla logica del codice o della classe in cui è stato creato il collegamento. È richiesta una semplice proprietà dell'evento puntatore nell'elemento di stile che si riferisce alla classe contenente il collegamento.