输入 type="radio" 和隐藏的单选按钮 - chrome 中的问题？答案

【问题标题】：Input type="radio" and hidden radio button - problems in chrome?输入 type="radio" 和隐藏的单选按钮 - chrome 中的问题？
【发布时间】：2013-01-21 22:55:12
【问题描述】：

我有这个 HTML：

<input type="radio">
<span class="label">
    <label id="options_34537_2label" for="options_34537_2">
</label>
</span>

现在我还有一些 CSS，它隐藏了单选按钮本身并在我的标签前面放置了一个图像。

input[type="radio"] {
    display: none;
}

label:before {
    background: url("someimage.jpg") no-repeat scroll 0 0 transparent;
}

在 IE 和 FF 中，我可以单击图像来选择选项，在 Chrome 中，单击根本不起作用。知道如何解决这个问题吗？

谢谢！

【问题讨论】：

标签： css google-chrome

【解决方案1】：

你应该把<input> 放在 <label> 里面，让它可以被点击：

<label><input type="radio"></label>

直接使用标签上的背景属性，而不是使用 :before 伪类。然后添加一些文本或指定宽度以显示您的背景。

【讨论】：