0

DIV内にチェックボックスとラベルのCSSクリックイベントを追加するにはどうすればよいですか? 「」を削除すると、以下のコードは機能しません。完璧に機能します。なぜ起こっているのですか？

HTML

<div id="wrapper">
       <input name="" type="checkbox" value="" id="hub" class="hub"  style="display:none;"/>
       <label for="hub"  class="hub2"></label>
    </div>

    <div class="slide"> 
       the contents
    </div>

CSS

.slide{
    background:red; 
}


input[type=checkbox].hub:checked ~ .slide {
    background:green !important;    
}
4

1 に答える 1

2

次のように、要素をおよび.slideとともに配置する必要があります。labelinput[type=checkbox]

<div id="wrapper">
   <input name="" type="checkbox" value="" id="hub" class="hub"  style="display:none;"/>
   <label for="hub"  class="hub2">open</label>
   <div class="slide"> 
      the contents
   </div>
</div>

Demo

More on sibling selector

于 2013-06-09T07:37:07.580 に答える