一起使用3个伪元素？

Question

我想询问是否可以在同一个CSS规则上同时使用伪元素:hover，:not()和:after

我需要在这段代码中使用全部3：

#sidebar ul:not(.sub-menu) li:hover:after{
    content: "";
    width:100%;
    height:50px;
    position:absolute;
    top:0;
    left:0;
    z-index:100;
    background: rgba(0,0,0,0.4);
}

由于我有一个侧边栏，我使用伪元素导致菜单项上的悬停效果，但我想避免主菜单<li>在子菜单{{1时进入悬停状态徘徊。

Answer 1

您可以通过以下方式轻松选择：

#sidebar ul li { // Styles for the main li }

然后对于他们的子<li>这样的事情：

#sidebar ul li > ul li { // Styles for the sub menu li }