Псевдоклас valid

Псевдоклас valid задае стыль для інпутаў, у якія ўвялі правільнае значэнне або значэнне адпаведнае паказанаму тыпу.

Сінтаксіс

cssселектар:valid {
  
}

Прыклад

Давайце перафарбуем фон інпута ў ружовы колер, калі ўводзіцца няправільнае значэнне і назад у зялёны колер, калі значэнне прайшло праверку на адпаведнасць абранага тыпу:

html<p>Увядзіце ваш email</p>
<p><input type="email"></p>

cssinput:invalid {
  background: #E37D76;
}
input:valid {
  background: #9DDFA4;
}

Результат:

Глядзіце таксама