单选按钮样式

时间:2011-12-16 01:37:28

标签: css input checkbox radio-button appearance

我想用纯CSS设置单选按钮的样式,没有类或ID。只需输入[type = radio]。 我想使用未选择和选择的背景图像。 但是,-vendor-appearance:none;不适用于Trident或Gecko。只是Webkit。 在这些浏览器中,您可以看到背景图像作为单选按钮的背景,但按钮仍然存在而不仅仅是显示图像,如何摆脱按钮,只显示背景图像。小提琴:http://jsfiddle.net/7kScn/

3 个答案:

答案 0 :(得分:8)

你可以使用CSS2选择器技巧连接到一个无线电组,然后立即显示其他内容。

请参阅:http://jsfiddle.net/7kScn/1/

这只是一个基本的例子,但它的前提是隐藏输入字段,然后在标签之后立即设置标签样式,这样就可以确保它是您正在检查的实际内容。

答案 1 :(得分:1)

这有用吗?     input [type = radio]:checked {     边框:1px纯黑色;     }

答案 2 :(得分:0)

我写了一篇关于如何仅使用CSS自定义复选框和无线电的教程,以及通过设置标签样式并使用它的:before:after伪类来创建开/关开关。也许这有帮助:)在这里阅读:http://blog.felixhagspiel.de/index.php/posts/custom-inputs