Подтвердить что ты не робот

Как создать HTML-сообщение об ошибках проверки формы HTML с помощью CSS?

Как мне создать сообщения об ошибках проверки формы HTML5 с помощью CSS?

4b9b3361

ОТВЕТЫ

Ответ 1

В настоящее время нет способа подгонять эти маленькие подсказки для проверки. Единственный другой вариант, который я решил сделать, заключается в том, чтобы отключить проверку браузера все вместе и теперь полагаться на мои собственные скрипты проверки на стороне клиента.

Согласно этой статье: http://blog.oldworld.fr/index.php?post/2010/11/17/HTML5-Forms-Validation-in-Firefox-4

"Самый простой способ отказаться - добавить атрибут novalidate в ваш <form>. Вы также можете установить formnovalidate в элементах управления отправкой."

Ответ 2

Chrome обеспечивает естественный внешний вид для своих пузырьков речи об ошибках проверки. Пузырька ошибок состоит из четырех элементов, которые не являются нормативными элементами. Эти четыре элемента стилизуются с помощью псевдоэлементов, которые применяются к отдельным разделам пузыря:

::-webkit-validation-bubble

::-webkit-validation-bubble-arrow-clipper 

::-webkit-validation-bubble-arrow 

::-webkit-validation-bubble-message

Обновление: Этот метод устарел.

Ответ 3

Используйте псевдоселектора, как сказал easwee. Например, чтобы сделать элемент формы зеленым, когда он действителен, а красный - недействительным, выполните следующие действия:

:invalid {
    background: #ffdddd;
         }
:valid{
      background:#ddffdd;
      }

Если вам нужна полная ссылка на них, перейдите в ссылку на Mozilla.

P.S. Извините, если я делаю эти ответы неправильно, я новичок в этом сообществе.

Ответ 4

Обязательное поле будет недействительным, пока не будет введен правильный ввод. Поле, которое не требуется, но имеет проверку, например поле URL, будет действительным до ввода текста.

 input:invalid { 
border:solid red;
}

для получения дополнительной информации http://msdn.microsoft.com/en-us/library/ie/hh772367 (v = vs .85).aspx