Question

是否可以在：not tag中使用伪类？

示例：

li:not(.inner:hover):hover { // Code }

<li>
   <div class="inner"></div>
</li>

当我悬停内部项目时，我试图取消父级悬停的效果，而不使用javascript。

上面代码的预期结果是当你悬停li而不是内部div时，li得到了悬停效果。但只有你没有徘徊在.inner。

更新

http://jsfiddle.net/eTV86/ 我想要的是，当.inner变黑时，li会变回红色。

Answer 1

是的，但是您同时使用了类和伪类，这是无效的：

li:not(.inner:hover):hover

即使您将其更改为有效的内容（根据this answer）：

li:not(.inner):hover, li:not(:hover):hover

第一个选择器将始终与您的li悬停匹配，第二个选择器将永远不匹配任何内容。它永远不会与您的div.inner匹配，因为您将:not()附加到li。

最后，如果您想在li获得悬停时更改.inner，那么当前的CSS选择器无法做到这一点。你需要JavaScript。

Answer 2

您可以使用简单的css而不是伪类

HTML

<ul>
<li class="active"><a href = "#">Link 1</a></li>
    <li><a href = "#">Link 2</a></li>
    <li><a href = "#">Link 3</a></li>
</ul>

CSS

ul li a{ color:black}
ul li a:hover { color:red }
ul li.active a:hover { color:black /*re use the same properties which is there in default style viz ul li a{} */}

DEMO http://jsfiddle.net/mKQas/2/

伪类里面：没有

2 个答案: