问题

我尝试使用以下格式设置复选框:

<input type="checkbox" style="border:2px dotted #00f;display:block;background:#ff0000;" />

但是,它仍显示默认复选框.如何做?



解决方法

更新: 下面的答案引用了CSS3广泛可用之前的状态.在现代浏览器(包括Internet Explorer 9和更高版本)中,使用您首选的样式创建复选框更换更为简单,而无需使用javascript.

以下是一些实用的连结:

值得注意的是,根本问题没有改变.您仍然无法直接对checkbox元素应用样式(边框等),并且这些样式会影响HTML复选框的显示.然而,改变的是,现在可以隐藏实际的复选框,并替换为自己的样式化元素,而不使用CSS.特别是,因为CSS现在有广泛支持的:checked 选择器,您可以使您的替换正确地反映框的选中状态.


OLDER ANSWER

以下是关于样式复选框的实用文章.基本上,作家发现,它从浏览器到浏览器变化巨大,并且许多浏览器总是显示默认的复选框,无论你的风格.所以真的不是一个简单的方法.

不难想象这是一个解决方法,你将使用javascript来覆盖复选框上的图像,并点击该图像导致选中真正的复选框.没有javascript的用户将看到默认复选框.

已编辑以添加:此处是一个不错的脚本, / a>;它隐藏了实际的checkbox元素,将其替换为样式化的span,并重定向点击事件.




相关问题推荐