主菜单影响子菜单

Question

我将边框样式应用到我的主菜单li。 但我的子菜单李也受到主菜单李风格的影响。 这里是示例代码，请告诉我如何解决这个问题。

ul.menu li {
        border-left:1px solid #fcfcfc;
        border-right:1px solid #e8e8e8;
    }

上面的样式也在我的子菜单li上呈现。 我不想使用类或id我希望直接样式标记。 有什么方法可以停止在我的子菜单上渲染边框。

    ul.menu ul li {
         min-width: 200px;

    }

Answer 1

如果您只想影响<ul>与课程menu的直接子女，则需要使用此选择器：

ul.menu > li {
    ...
}

所以如果你有这个结构：

<ul class="menu">
    <li>One</li>
    <li>Two
        <ul>
            <li>Three</li>
        </ul>
    </li>
</ul>

然后，这将为<li>元素设置内容为One和Two的样式，而不是子菜单<li>设置为Three。