Question

这是旧HTML

<div class="MainClass">
    <input type="checkbox" name="ppp" id="ppp" class="subClassInput">
    <label for="subClassLabel"></label>
</div>

这是新HTML：

<div class="MainClass">
    <span class="subClassInput">
        <input type="checkbox" name="ppp" id="ppp">
    </span>
    <label for="subClassLabel"></label>
</div>

我的css工作正常，但我想使用asp.net，它渲染了asp：CheckBox，它周围有空间。我想我可以构建一个特殊的控件并覆盖它，但我宁愿只修复我的CSS。

所以，在检查输入工作正常之后到达标签：

.MainClass input[type=checkbox]:checked + label:after {
 //attributes
 }

但现在我不知道在检查输入后如何到达标签。

由于

Answer 1

目前无法在CSS或CSS3中执行<或:parent选择器。否则你可能会做这样的事情：

span < input[type=checkbox]:checked + label:after

或者

input[type=checkbox]:checked:parent + label:after

阅读此http://css-tricks.com/parent-selectors-in-css/

Answer 2

由于OP要求提供脚本解决方案，因此这里有一个。注意我正在利用jQuery库，你需要包含它。

$(function(){
    $('input[type=checkbox]').click(function(){
          if($(this).is(':checked')){
             var label = $(this).parent().siblings('label');
             //apply your CSS styles here
          }
    });
});

css邻近选择器与嵌套元素和：之后

2 个答案: