1

有没有办法用纯 css 设置复选框或单选按钮的样式，即没有 jQuery 的 class="newstyle"？我一直在网上搜索，我想知道是否有一种方法可以仅使用 class="" 属性来实现这一点。这是一个例子：http ://www.filamentgroup.com/examples/customInput/

编辑：我目前实现这一目标的方式：

<div class="styled-checkbox">
 <input type="checkbox" id="checkbox1" value="1" />
 <label for="checkbox1"><span></span>Test</label>
</div>

但是，不确定这是否是实现此目的的正确方法，从兼容性的角度来看，此外，div 默认需要预设宽度，如果 auto 它将填充 DOM。

4

1 回答 1

0

只用一个类就可以达到预期的效果，但是说为复选框设置样式是错误的，因为它不能直接通过 CSS 设置样式。这是因为组件是由操作系统控制的，而不是由浏览器本身控制的。

解决方法是使用一组普通元素来模拟复选框的外观。

在您提供的链接的具体示例中，复选框完全隐藏，因为它位于标签 via 后面z-index，该标签的背景包含改进版本的复选框图形。结合事实，如果您对复选框和标签使用id\for 属性对，当您单击标签（显示复选框的图像）时，复选框将更改它的选中/未选中状态。

于 2013-02-22T20:34:00.323 回答