如何防止CSS继承？

  • Z时代
  • 2024-01-10
  • 分类：问答

我的侧边栏中有一个使用嵌套列表（

    和
  • 标记）的分层导航菜单。我使用的预制主题已经具有列表项的样式，但是我想更改顶级项的样式，但不能将其应用于子项。是否有一种简单的方法可以将样式应用于顶级列表项标签，​​而无需将样式层叠到其子级列表项？我知道我可以在子项目中显式添加重写样式，但是如果有一种简单的方法，只是说“将这些样式应用于此类并且不要级联，我真的很想避免必须重复所有样式代码”他们将其归结为任何子元素”。这是我正在使用的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现在使用的样式特定于某些类？

    回答：

    到目前为止，还没有父选择器（或ShaunInman称其为合格选择器，因此您将必须将样式应用于子列表项，以覆盖父列表项上的样式。

    级联是级联样式表的全部要点，因此得名。

    以上是 如何防止CSS继承？ 的全部内容， 来源链接： utcz.com/qa/428088.html

回到顶部