CSS псевдокласс :valid

❮ Назад Вперед ❯

Псевдокласс :valid выбирает элементы <form> со значением, которое проходит проверку в браузере на соответствие параметров элемента.

Селектор :valid работает только для элементов <input> с атрибутами min и max, для type="number", значение которого число, а не буквы, для type="email" с корректным адресом электронной почты.

Версия

CSS3

Синтаксис

:valid {
css declarations;
}

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок документа</title>
    <style>
      input{
      border:1px solid #cccccc;
      padding:5px 10px;
      }
      input:valid {
      background-color: #eeeeee;
      }
    </style>
  </head>
  <body>
    <h2>Пример селектора :valid</h2>
    <form>
      <input type="email" value="[email protected]">
    </form>
  </body>
</html>