我有以下html：
<label>
<input type="checkBox" value="cb_val" name="cb_name">
my checkBox text
</label>
label { background-color:#333; color:#FFF; }
现在,我想在选中复选框时更改标签的背景颜色.
我知道如何使用javascript,但有没有办法只使用CSS？
我已经看到了一些解决方案,但它们使用相邻的兄弟选择器,只有当复选框后面出现标签时才能使用.
我仍然希望在没有javascript的情况下解决这个问题,有没有人有线索？
更新：
因为我害怕,它不能这样做,所以我必须用JS做,或用不同的HTML结构实现相同的视觉效果.
我想一次性设置标签和文本框的背景颜色,所以我可以使用一个解决方案,其中复选框绝对放在标签的顶部.好点PlantTheldea！
或者我可以将背景颜色应用于标签和复选框.
感谢大家！
解决方法
你可以用这样的纯css实现这个,
<input type="checkBox" id="cb_1" value="cb_val" name="cb_name"> <label for="cb_1"> my checkBox text </label>
有了这个CSS,
label { background-color:#333; color:#FFF; }
input[type="checkBox"]:checked + label {
background: brown;
}
记住
标签必须在复选框之后,因此您需要对其进行更多样式以保持您的外观.
这里有一个样式选项,可以让你拥有与你想要的相同的外观,New fiddle.这不涉及任何绝对的定位,只是一些诡计.
