Разработайте стили ввода HTML5, если проверка не пройдена

Question

Привет всем

Мой вопрос довольно прост: мне нужно стилизовать красную границу (или тень?) Входов, которые не могут быть проверены (например, электронная почта).Есть ли какой-нибудь новый трюк CSS, чтобы сделать это?

Если вы все еще не понимаете, о чем я говорю, то этот цвет нужно изменить:

Answer 1

Подробнее о Firefox см. https://developer.mozilla.org/en/CSS/%3Ainvalid, хотя предположительно части без "-moz" применимы и к другим браузерам:

Псевдокласс :invalid CSS применяется автоматически<input> элементы, содержимое которых не может быть проверено в соответствии с настройкой типа входа.Это позволяет вам легко принимать недопустимые поля в виде внешнего вида, который помогает пользователю идентифицировать и исправлять ошибки.

По умолчанию Gecko не применяет стиль к псевдоклассу :invalid.Однако он применяет стиль (красное свечение с использованием свойства box-shadow) к псевдоклассу :-moz-ui-invalid, который применяется в подмножестве случаев для :invalid.