I pulsanti vengono generalmente utilizzati per eseguire un'azione specifica. Ad esempio, quando si fa clic sul pulsante aggiunto, attiverà un determinato evento. CSS ci consente di disabilitare l'evento Click. Quindi, se si desidera disabilitare l'evento click, aggiungi un evento puntatore in CSS e imposta il suo valore in base ai requisiti.

In questo articolo, impareremo come disabilitare l'evento click usando CSS.

Quindi iniziamo!

Come disabilitare l'evento Click Utilizzo di CSS?

È possibile disabilitare gli eventi clicca utilizzando il CSS "Eventi di puntatore" proprietà. Ma, saltando dentro, te lo spiegheremo brevemente.

Cos'è la proprietà CSS "puntatore-eventi"?

IL "Eventi di puntatore"Controlla come gli elementi HTML rispondono o si comportano all'evento touch, come eventi Click o Tocca, stati attivi o hover e se il cursore è visibile o no.

Sintassi
La sintassi degli eventi puntanti è la seguente:

Puntatore-Event: Auto | Nessuno;

La proprietà sopra menzionata richiede due valori, come "auto" E "nessuno":

• auto: Viene utilizzato per eseguire eventi predefiniti.
• nessuno: È utilizzato per disabilitare gli eventi.

Nota: l'esempio di seguito dimostrerà innanzitutto come aggiungere due pulsanti attivi, quindi disabiliteremo l'evento click del secondo pulsante.

Esempio 1: disabilitazione Fai clic sull'evento dei pulsanti usando CSS
In questo esempio, creeremo una rotta

e due pulsanti. Successivamente, specificare il “pulsante"Come il nome della classe del primo pulsante e assegna"pulsante" E "Button2"Come le classi del secondo pulsante.

Html

Disabilita clic su Evento utilizzando CSS

Pulsante Abilita
Pulsante Disabilita

In CSS, ".pulsante"Viene utilizzato per accedere a entrambi i pulsanti creati nel file HTML. Successivamente, imposta lo stile di confine come "nessuno"E dare imbottitura come"25px". Successivamente, imposta il colore del testo del pulsante come "RGB (29, 6, 31)"E lo sfondo del pulsante come"RGB (19, 192, 163)". Imposteremo anche il raggio di un pulsante come "5px".

CSS

.pulsante
confine: nessuno;
imbottitura: 25px;
Colore: RGB (29, 6, 31);
Background-color: RGB (19, 192, 163);
raggio di confine: 5px;

Successivamente, applicheremo la pseudo-Classe attiva su entrambi i pulsanti come ".Pulsante: attivo"E imposta il colore del pulsante come"RGB (200, 255, 0)":

.Button: attivo
Background-color: RGB (209, 65, 65);

Di conseguenza, vedrai il seguente risultato:

Ora passeremo alla parte successiva in cui disabiliteremo l'evento click per il secondo pulsante.

Per farlo, usa ".Button2"Per accedere al secondo pulsante, creato nel file HTML e, successivamente, impostare il valore della proprietà puntatore-evento come"nessuno":

.Button2
Event puntatore: nessuno;

Utilizzando la proprietà puntatore-eventi e l'impostazione del suo valore su non disabiliterà l'evento click, che può essere visualizzato nel seguente output:

Abbiamo fornito il metodo più semplice per disabilitare l'evento click usando CSS.

Conclusione

Per disabilitare l'evento Click in HTML, il “Eventi di puntatore"Viene utilizzata la proprietà di CSS. A tale scopo, aggiungi un elemento HTML e imposta il valore della proprietà puntatore-event come “nessuno"Per disabilitare il suo clic di clic. Questo articolo ha spiegato come disabilitare l'evento Click usando CSS insieme al suo esempio.