伪类里面：不 [英] Pseudo-class inside :not

问题描述

是否可以在a：not标签中使用伪类？

示例：

  li：not（.inner：hover）：hover {// Code} 
 
< li> 
< div class =inner>< / div> 
< / li> 
 

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

上面代码的预期结果是当你悬停li，但不是内部div，li get的悬停效果。

$ b

更新

http://jsfiddle.net/eTV86/
我想要的是，当.inner变成

$ p

解决方案

是的，但是你使用了类和伪类，这是无效的：

  li：not（.inner：hover）：hover 
  

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

  li：not（.inner）：hover，li：not（：hover）：hover 
  

$ b b

在悬停时，第一个选择器将始终匹配 li ，第二个选择器将不匹配任何内容。它不会与您的 div.inner 匹配，因为您将：not（）附加到<$ c $最后，如果您要更改 li

.inner 获取悬停，这是不可能与当前的CSS选择器。您需要使用JavaScript。

Is it possible to use a pseudo class inside of a :not tag?

Example:

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

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

I am trying to cancel out the effect of the parent hover, when I hover an inner item, without using javascript.

The expected result for above code is when you hover the li, but not the inner div, the li get's a hover effect. But only if you're not hovering the .inner.

Update

http://jsfiddle.net/eTV86/ What I want is, when the .inner turns black, the li turns back to red.

解决方案

Yes, but you're using both a class and a pseudo-class, which is invalid:

li:not(.inner:hover):hover

Even if you change it to something that's valid (as per this answer):

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

The first selector will always match your li on hover, and the second selector won't ever match anything. It will never match your div.inner because you're attaching the :not() to the li.

Lastly, if you want to change the li when .inner gets a hover, that's not possible with current CSS selectors. You'll need JavaScript.

这篇关于伪类里面：不的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！