是否可以将css(3)样式应用于选中的单选按钮的标签?
我有以下标记:
<input type="radio" id="rad" name="radio"/> <label for="rad">A Label</label>
我希望的是
label:checked { font-weight: bold; }
会做某事,但是可惜它没有(我预期的那样)。
是否有一个选择器可以实现这种功能?如果有帮助,您可以将divs围起来,但是最好的解决方案是使用标签“ for”属性。
应该注意的是,我能够为我的应用程序指定浏览器,所以请最好使用css3等类。
尝试+符号:它是相邻的同级组合器。它结合了两个具有相同父级的简单选择器序列,第二个选择器必须在第一个选择器之后 立即 出现。
+
因此:
input[type="radio"]:checked+label{ font-weight: bold; } //a label that immediately follows an input of type radio that is checked
适用于以下标记:
<input id="rad1" type="radio" name="rad"/><label for="rad1">Radio 1</label> <input id="rad2" type="radio" name="rad"/><label for="rad2">Radio 2</label>
…,只要标签跟随无线电输入,它将适用于任何结构,无论是否带有div等。
例:
input[type="radio"]:checked+label { font-weight: bold; } <input id="rad1" type="radio" name="rad"/><label for="rad1">Radio 1</label> <input id="rad2" type="radio" name="rad"/><label for="rad2">Radio 2</label>