在第三个子菜单后重置 css 属性

Question

我有一个包含 5 个子菜单的 Wordpress 菜单。类似于：

• 项目 1
  • 项目 2
    • 项目 3
      • 项目 4
        • 项目 5
          • 项目 6
• 项目 1
• 项目 1
• 项目 1

我正在使用 css 添加一些样式。问题是，当我做类似的事情时：

ul { padding: 10px; }

它将这条规则添加到每个项目，但我只想将它添加到前两个 "ul" 标签。我知道我能做到：

ul, ul ul { padding:10px;}
ul ul ul { padding:initial !important }

但是有更好的解决方案吗？

Answer 1

使用直接子选择器>:

ul:first-child,ul>ul{padding: 10px;}

但我想建议您对它们使用通用的 class 并在其中使用填充：

ul.pd10{padding: 10px;}