2017-08-01 65 views
2

我上的元素相结合三类CSS:没有选择 - 从悬停

base, base_green, base_blue 

我使用这个添加悬停效果排除多个类只base类(不base_green

.base:not(.base_green):hover { 
    background-color: #E2E2E2; 
} 

我如何使用两个类来存档?
这意味着,如果元素有base base_greenbase base_blue,不就可以了
如增加悬停效果。这样的事情(不工作OFC)

.base:not(.base_green):not(.base_blue):hover { 
    background-color: #E2E2E2; 
} 

编辑:
谢谢大家的答案,我最初的解决方案正常工作
我曾在:not选择该级联香肠一个错字在我的CSS文件
/捂脸

我会离开的问题,因为它是,也许有人认为它有用

+2

的可能的复制[我可以有多个:选择不()] (https://stackoverflow.com/questions/5684160/can-i-have-multiple-not-selectors) –

+0

不知道,如果你有其他元素的类包含短语“base_”需要应用悬停状态,但如果不,你可以试试'.base:not([class * =“base _”]):hov否则,如果可能的话,向不应该应用此状态的元素添加一个类并将其用作选择器可能更容易。 – UncaughtTypeError

+1

这对我来说至少在Chrome中是这样的:https://jsfiddle.net/7assquqp/ –

回答

4

此:

.base:not(.base_green):not(.base_blue):hover { 
    background-color: #E2E2E2; 
} 

工作完全正常,如果抛出一个JSFiddle

与以下HTML测试:

<div class="base base_green">GREEN</div> 
<div class="base base_blue">BLUE</div> 
<div class="base base_green base_blue">GREEN & BLUE</div> 
<div class="base">BASE</div> 
+0

奇怪......它不适合我...我会更多地测试它 –

+0

它的工作原理...我在css文件中有一个错字:/ ... thanx清除那个 –

+1

啊,好的旧错字^^他们可以很讨厌,很高兴有帮助!这个项目@WolfWar祝你好运 – Simplicity