如何在HTML5中使用电子邮件标签

Question

在HTML5中有一个新标签

<input type="email">

当我在表单中使用它时，当我将其留空或放入非电子邮件文本或其中显示的错误看起来很奇怪。如何更改该错误框的CSS和文本？

Answer 1

对于Google Chrome，您可以使用以下伪类来设置气泡的样式：

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

不确定/其他浏览器是否支持样式化错误消息。请参阅以下链接以供参考：

Styling HTML5 Form Validation Errors

How do you style the HTML5 form validation messages?