Как использовать тег электронной почты в HTML5

В HTML5 появился новый тег

<input type="email">

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


person Sahil Grover    schedule 27.09.2011    source источник
comment
В каком браузере/версии это выглядит странно? Кроме того, электронная почта — это не тег, а просто тип ввода.   -  person Matt Ball    schedule 28.09.2011
comment
дубликат: stackoverflow. com/questions/5478800/   -  person amosrivera    schedule 28.09.2011
comment
@amosrivera спасибо за ссылку, но там написано, что нельзя редактировать CSS, неужели для этого нет способов ??   -  person Sahil Grover    schedule 28.09.2011
comment
Нет, ниет, нэйн, ниенте, нада. Если это действительно так важно, я предлагаю вам использовать подход js   -  person amosrivera    schedule 28.09.2011
comment
@amosrivera kkiesss спасибоssss   -  person Sahil Grover    schedule 28.09.2011
comment
Публикую это как комментарий, потому что у меня нет опыта работы с этим, но, согласно этой статье, если браузер поддерживает базовый модуль пользовательского интерфейса CSS3 (w3.org/TR/css3-ui), то есть несколько псевдоклассов, которые можно использовать для управления проверкой. Статья здесь: alistapart.com/articles/forward-thinking-form-validation Поддержка браузеров ограничена новыми, но это довольно большой список.   -  person Doozer Blake    schedule 28.09.2011
comment
@Blake это манипулирует стилем ввода, а не ошибкой всплывающего окна.   -  person amosrivera    schedule 28.09.2011
comment
@amosrivera мой плохой, ты прав. Я думаю, меня обманули стили вокруг подсказок к образцу, которые они добавили, которые были оформлены и отображены, а не фактические сообщения проверки, поступающие из браузера.   -  person Doozer Blake    schedule 28.09.2011
comment
мне не повезло :( ..... в любом случае спасибо всем :)   -  person Sahil Grover    schedule 28.09.2011


Ответы (1)


Для Google Chrome вы можете использовать следующие псевдоклассы для стилизации пузыря:

::-webkit-validation-bubble {}
::-webkit-validation-bubble-arrow-clipper {}
::-webkit-validation-bubble-arrow {}
::-webkit-validation-bubble-message {}

Не уверен, будут ли/когда другие браузеры поддерживать стилизацию сообщений об ошибках. См. следующие ссылки для справки:

Стили ошибок проверки формы HTML5

Как вы оформляете сообщения проверки формы HTML5?

person opes    schedule 28.09.2011