Pseudoclase invalid
La pseudoclase invalid define el estilo
para un input que ha recibido un valor incorrecto
o un valor que no coincide con el tipo
especificado.
Sintaxis
selector:invalid {
}
Ejemplo
Vamos a cambiar el fondo del input a color rosa cuando se introduce un valor incorrecto y de vuelta a verde, cuando el valor ha pasado la validación del tipo seleccionado:
<p>Introduce tu email</p>
<p><input type="email"></p>
input:invalid {
background: #E37D76;
}
input:valid {
background: #9DDFA4;
}
:
Ver también
-
la pseudoclase
:valid,
que define el estilo para un input que ha recibido un valor correcto -
la pseudoclase
:default,
que define el estilo para los elementos por defecto -
la pseudoclase
:in-range,
que define el estilo para los elementos con un rango de valores especificado -
la pseudoclase
:out-of-range,
que define el estilo para los elementos cuyos valores están fuera del rango especificado
