CSS3仅在隐藏子项时设置样式

给定下面的html，只使用CSS，不使用JS/jQuery-只有在第二个LI（.dropdown可选）被隐藏（display:none）的情况下，我如何以特定的方式设置第一个LI>A的样式

项目1


项目2

---

谢谢

仅使用CSS是不可能的。你需要JS。如果你想在下拉列表中添加一个css类，而不是设置display:none，你可以使用css3通用同级选择器：li.hidden~li{/*css*/}这在IE中有点问题..Johan，你不能这样做，至少在这种情况下不能。不幸的是，同级选择器只有在

~

后面声明的选择器在html中声明的选择器之后才起作用（我同意这不是最好的措辞）。例如，

p~a

只对

a

元素起作用，这些元素前面有

p

element@JOPLOmacedo我没有意识到这一点，谢谢你纠正我^^我会用稍微不同的方式来处理它。通过将类（.optional dropdown show）应用于父UL，然后可以使用CSS隐藏.dropdown optional，例如：.dropdown optional{display:none；}，.optional dropdown show.dropdown optional{display:block；}。从这里，您可以根据UL类（例如：UL>li>a.btn{color:red；}）以及UL.optional-dropdown-show>li>a.btn{color:green；}设置第一个锚链接的样式。当然，这可能不适合您，具体取决于您的场景或其他需要。

<ul>
  <li>
    <a class="btn">Item 1</a>
  </li>
  <li class="dropdown-optional">
    <a class="btn">Item 2</a>
  </li>
</ul>