Pseudo-classe :invalid CSS

Definizione e uso

CSS :invalid Il pseudo-classe viene utilizzato per impostare lo stile degli elementi del modulo non validi.

Attenzione:Questo pseudo-classe si applica solo agli elementi del modulo con restrizioni, come gli elementi di input con attributi min e max, campi di email senza email validi o campi numerici senza numeri, ecc.

Attenzione:Se uno qualsiasi dei pulsanti di opzione in un gruppo di pulsanti di opzione è obbligatorio, il pseudo-classe verrà applicato a tutti i pulsanti di opzione se nessun pulsante di opzione nel gruppo è selezionato.

Attenzione:Usa :valid Il pseudo-classe imposta lo stile degli elementi del modulo validi.

Esempio

Imposta lo stile degli elementi <fieldset> e <input> non validi:

fieldset:invalid {
  border: 2px solid red;
  background-color: beige;
}
input:invalid {
  border: 2px solid red;
  background-color: beige;
}

Prova tu stesso

Sintassi CSS

:invalid {
  declarazioni css;
}

Dettagli tecnici

Supporto del browser

Le numeri nella tabella indicano la versione del browser che supporta per la prima volta il pseudo-classe.

Pagine correlate

Riferimento:Selettore CSS :valid