是否可以根据是否使用CSS检查输入来设置标签样式,还是我使用javascript卡住了?
<label class="filterButton"> <input name="RunandDrive" type="checkbox" value="1"> </label>
您可以使用:checked
伪元素来检查是否选中了复选框。这适用于单选按钮和复选框。
问题是你想要选择一个元素的父元素,但在css中实际上没有父选择器。解决方法是在输入元素之后(或之前)放置标签元素并使用适当的选择器。在这种情况下,我将label元素放在input元素后面,并使用+
选择器。
input[type=checkbox]+label {
background-color: green;
}
input[type=checkbox]:checked+label {
background-color: red;
}
<input type="checkbox" id="ossm" name="ossm">
<label for="ossm">Click to turn RED!</label>
但是如果你真的必须将input元素作为label元素的子元素,那么是的,你必须坚持使用JavaScript。
为了使用“已选中”复选框设置标签,首先你必须为输入“Checkbox”id="qid"
设置一个ID,然后将标签这个代码for="qid"
添加到这个复选框输入的标签上
就这样!
input[type=checkbox] + label {
color: #ccc;
font-style: italic;
}
input[type=checkbox]:checked + label {
color: #f00;
font-style: normal;
}
<input name="RunandDrive" type="checkbox" value="1" id="qid">
<label class="filterButton" for="qid"> Thsis will be styled</label>