Pseudoclase valid
La pseudoclase valid define estilos
para inputs que contienen un valor correcto
o un valor que coincide con el tipo
especificado.
Sintaxis
selector:valid {
}
Ejemplo
Vamos a cambiar el color de fondo del input a 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
:invalid,
que define estilos para un input que contiene un valor incorrecto -
la pseudoclase
:out-of-range,
que define estilos para elementos cuyos valores están fuera del rango -
la pseudoclase
:in-range,
que define estilos para elementos con un rango de valores definido