应用display：none;未选择的元素

Question

我有几个div。其中一人有class="active"。我希望隐藏所有div（display:none;），但.active除外。选择器应该是什么？

Answer 1

你试过吗？

div { display: none; }

div.active { display: block; }

PS。我会补充说明。当您在选择器中指定一个类时，它在级联逻辑中具有更高的优先级（因为它更高specificity）而不仅仅是一个div（因为单个div更通用，更宽）。所以没有必要使用!important或类似的东西。

Answer 2

尝试:not pseudo-class。

例如：

div:not(.active) {display:none;}

正如Paul在下面评论的那样，IE8及以下版本不支持此选择器。但考虑到您添加了CSS3标记并专门要求提供选择器，这可能不是问题。有关跨浏览器的解决方案，请参阅@mkdotam answer。

Answer 3

div:not(.active){
    display: none;
}

Answer 4

在css中使用!important，类似：

.active {
    display: block !important;
}

和示例：http://jsfiddle.net/hNLen/