如何使复选框IE7和IE8兼容? (使用jQuery)

时间:2013-04-02 00:18:53

标签: html forms css3 internet-explorer-7

IE8截图(Bug): enter image description here

Google Chrome“屏幕截图”(应该是什么样子): enter image description here

当前复选框已使用CSS3设置样式有没有办法让它兼容?

我们在JSFiddle中完成的复选框样式是CSS3技术的一部分,因此较低的浏览器无法呈现其中的一些原因。请检查IE Tester上的表格(您可以下载并测试较低的IE版本,如果使用的是Windows),您将看到我的意思。

http://www.fratelliristorante.com.au/contact.html

http://jsfiddle.net/E5CxM/2/

<p>
<label></label>
<input type="checkbox" id="checkbox" name="checkbox" class="regular-checkbox big-checkbox" value="Yes" checked="checked">
<label for="checkbox" style="margin-right:10px;"></label>Subscribe me to your mailing list for upcoming events, hot offers and deals
</p>

注意:我们还使用了Dropkick(jQuery),它只对选择框进行样式设置,但没有样式复选框。

2 个答案:

答案 0 :(得分:2)

它不起作用的原因是旧的IE不支持:after

我已更新您的HTML以使用隐藏的<span>来保留复选标记,并调整CSS以切换其可见性。

Updated Fiddle

答案 1 :(得分:0)

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<![endif]-->

现在创建名为all-ie-only.css的css文件并将他的精简版本放到IE中,因为他有bug。 你可以使用它来制作不同的文本框。