html - 防止父母李+李携带给孩子

Question

我在导航菜单上使用它来分隔列表项

nav li + li:before{
    content: " | ";
}

这会在每个列表项之间放置一个栏，它不会将栏放在第一个元素之前。并且使用 :before 伪选择器，它不会在最后放置一个。（如此处建议的导航分隔符）

但是，我想防止这种情况传递到子列表项。

例如nav ul li ul li

我已经在孩子身上试过了content:none;，content:"";但它们仍然显示在子菜单中。

请帮忙！

Answer 1

不覆盖的替代方法，使用子组合器 ( >)：

nav > ul > li + li:before {
    content: " | ";
}

如果该元素是另一个元素的直接子元素（而不是该元素的孙子元素），则子组合器将选择该元素。

Answer 2

啊——我找到了答案！

nav ul li li:before {
    content: "";
}