CSS多个类别选择

Question

有一个网页包含HTML片段：<div class="a b"></div><div class="a"></div>。如何用CSS隐藏第二个div，让第一个可见？请注意，我不能添加任何其他类，以及第一个div更改的可见性（有时是相对的，有时是绝对的），它不依赖于我。

Answer 1

可以隐藏既然后显示，有两类a和b

.a {display: none;} 
.a.b {display: block;} 

的一个。如果加价不会改变您可以隐藏第二个div有以下几点：

.a.b + .a {display:none;} 

此说与直接用如下两类a和b任何类a什么应该隐藏起来。

Answer 2

很简单。刚刚尝试这一点

.b {display:none;} 

Answer 3

只要创建B类选择：

.b { display: none; } 

如果需要，只有拥有一流的项目一个应该被隐藏时，他们也有B类，您可以使用多个类选择器通过连接两个类选择（无空白）：由于第一

.a.b { display: none; } 

Answer 4

div.a.b{display:none} /*take note, no spaces between .a and .b to signify that the div has both*/ 

，或者包含b，

div.b{display:none} 

Answer 5

你是什么意思，有时可见度是绝对的或相对的？可见度只能在div上隐藏或显示。

以下是你需要什么，你的更新问题

.a { display: hidden; } 
.b { display: inline !important; } 

Answer 6

CSS3定义negation pseudo-class：

.a:not(.b) { 
    display: none; 
} 

但是，它只在IE 9获得了支持，所以目前典型cross-browser solution是设置属性（包括那些你不想匹配的属性），然后用更多的创建另一个规则，恢复原始样式。这在IE 6及更早版本中仍然存在问题，因为他们仅考虑使用单个元素的multiple classes时的最后一个类。

.a { 
    display: none; 
} 
.a.b { /* IE6 will treat selector as '.b' */ 
    display: block; 
} 

注意，如果已经有与相匹配的元素，你不想碰，或者如果样式设置inline（这应该不是一个脚本的操作之外进行更具体的选择规则页面），您不需要添加第二条规则，因为.a具有如此低的特异性。