Question

我怎么能修复它，我需要在div的复选框中（两个部分都没有div工作），我只能使用纯CSS。

HTML：

<div><input type="checkbox"></div>
<ul>
    <li>PSD WEBSITES</li>
    <li>UI KITS</li>
    <li>PREMIUM PSD</li>
    <li>ABOUT</li>
    <li>BLOG</li>
</ul>

CSS：

div input:checked ~ ul {
    display: none;
}

Answer 1

〜组合器分离两个选择器并匹配第二个选择器元素只有在第一个元素之前，并且两者共享一个共同元素父节点。

您必须将html结构更改为：

＆＃13;

div input:checked ~ ul {
  display: none;
}

＆＃13;

<div>
  <input type="checkbox" />
  <ul>
    <li>PSD WEBSITES</li>
    <li>UI KITS</li>
    <li>PREMIUM PSD</li>
    <li>ABOUT</li>
    <li>BLOG</li>
  </ul>
</div>

＆＃13;

<强>参考

General sibling selectors

CSS Selector，div输入：选中

1 个答案: