如何防止CSS继承？

我在侧边栏中有一个使用嵌套列表(< ul>和< li>标签)的分层导航菜单。我使用的已经有列表项目样式的预制主题，但我想改变顶级项目的样式，但不适用于子项目。有没有简单的方法来应用样式到顶级列表项标签没有那些样式级联到其子列表项？我明白我可以显式地添加重写样式到子项，但我真的想避免重复所有的样式代码，如果有一个简单的方法，只是说“应用这些样式到这个类，不要级联他们到任何孩子元素“。
这里是我使用的html：

<ul id="sidebar">
  <li class="top-level-nav">
    <span>heading 1</span>
    <ul>
      <li>sub-heading A</li>
      <li>sub-heading B</li>
    </ul>
  </li>
  <li class="top-level-nav">
    <span>heading 2</span>
    <ul>
      <li>sub-heading A</li>
      <li>sub-heading B</li>
    </ul>
  </li>
</ul>

所以css已经有“#sidebar ul”和“#sidebar ul li”的样式，但我想为“#sidebar .top-level-nav”添加额外的样式，而不是级联到它的子子孙。
有没有办法做到这一点简单，或者我需要重新安排所有的样式，所以在“#sidebar ul”的样式现在特定于某些类。

解决方法

由于还没有父选择器(或作为 Shaun Inman调用它们， qualified selectors)，因此您必须将样式应用于子列表项以覆盖父列表项上的样式。

级联是层叠样式表的一个整体，因此是名称。

原文地址：https://www.jb51.cc/css/222829.html