Question

#one input[type="checkbox"] + #Down{display:none;}

#one input[type="checkbox"]:checked + #Down{display:none;}

<ul>
 <li>
  <input name="one" type="checkbox" value="" class="inputCheck" id="one" /> 
      <div class="fl-L listItemsPadd">Sample</div>
      <a href="#" class="fl-L displayB helpIconlist-marg"></a>
      <label class="fl-L downloadPadd" id="Down"><a href="#" class="colorBL text-decoration ">Download</a>main form</label>
      <div class="clearboth"></div>
 </li>
</ul>

我试图在CSS中使用:checked选项。但是因为标签标签不在复选框旁边，所以这不起作用。

我的主要想法是检查“Downloadmain form”是否需要显示。

另外，它不显示。

任何人都可以帮忙。感谢

Answer 1

您可以通过使用CSS ~ general sibling selectors来实现此目的：

JSFiddle - DEMO

input[type="checkbox"]#one ~ #Down {
    display:none;
}
input[type="checkbox"]#one:checked ~ #Down {
    display:block;
}

<ul>
    <li>
        <input name="one" type="checkbox" value="" class="inputCheck" id="one" />
        <div class="fl-L listItemsPadd">Sample</div> <a href="#" class="fl-L displayB helpIconlist-marg"></a>
        <label class="fl-L downloadPadd" id="Down"><a href="#" class="colorBL text-decoration ">Download</a>main form</label>
        <div class="clearboth"></div>
    </li>
</ul>

任何人都可以帮助我输入CSS输入类型并进行检查

1 个答案: