在IE9 +中覆盖默认的css样式以进行验证

时间:2014-01-24 22:28:50

标签: css html5 internet-explorer-9

http://jsfiddle.net/4LXkE/

代码:

<form>
<input type="text" name="name" id="name" placeholder="Name*" required="required" />
<input type="submit" />
</form>

在上面的小提琴中,您可以看到在IE9 +中(这就是我的目标浏览器)输入框被一个丑陋的红色高亮显示和弹出消息所包围,以显示它是必填字段。 我发现以下问题很接近,但没有给出我特定问题的完整答案:

override css for html5 form validation/required popup

在我的应用程序中,我有自己的样式(twitter bootstrap默认值),但它们隐藏在这些样式背后。

当我尝试在Developer工具中调试应用程序时,我找不到正在添加的CSS类或方式。

任何帮助解决这些问题都将非常感谢,谢谢!

1 个答案:

答案 0 :(得分:2)

IE9本身不支持“required”属性,并且它不是UA样式表的一部分。

您是否正在使用Modernizr或类似Bootstrap的东西?在IE9中,没有polyfill,“required”属性是无用的。 (有关详细信息,请参阅caniuse或this article)请look at Modernizr获取此问题的解决方案。如果你已经使用了polyfill,你应该能够设置shim元素的样式以获得你想要的外观。