Pseudoclasse invalid
A pseudoclasse invalid define o estilo
para um campo de entrada que contém um valor inválido
ou um valor que não corresponde ao tipo
especificado.
Sintaxe
seletor:invalid {
}
Exemplo
Vamos alterar o plano de fundo do campo de entrada para rosa quando um valor inválido for inserido e de volta para verde quando o valor passar na verificação de correspondência do tipo selecionado:
<p>Digite seu e-mail</p>
<p><input type="email"></p>
input:invalid {
background: #E37D76;
}
input:valid {
background: #9DDFA4;
}
:
Veja também
-
a pseudoclasse
:valid,
que define o estilo para um campo de entrada que contém um valor válido -
a pseudoclasse
:default,
que define o estilo para elementos padrão -
a pseudoclasse
:in-range,
que define o estilo para elementos com uma faixa de valores especificada -
a pseudoclasse
:out-of-range,
que define o estilo para elementos cujos valores estão fora da faixa especificada
