单独的CSS选择器

可能重复：
Negative CSS selectors 单独的CSS选择器

，我想我的页面上分离出一些CSS，我有一个div

<div class="separate"> 
    <a href="#">a link</a> 
</div>

，这样，当我说

个

div{ 
    background:red; 
}

除了.separate所有div变红我需要一种方法来做到这一点不使用iFrame

来源

2011-07-17 Crystal Cafaro

这可以通过使用CSS3的not选择完成，并会在所有浏览器工作除了的Internet Explorer（惊喜惊喜）：

div:not(#seperate){ 
    background:red; 
}

如下所述：http://kilianvalkhof.com/2008/css-xhtml/the-css3-not-selector/

至于IE浏览器，我不认为这是可以做到的（除非你g ^每隔一个div（除了独立）另一个这样做的类。

例如

<div class="origClass notSeperate"></div> 
<div class="seperate></div> 
<div class="origClass2 notSeperate"></div>

但是，这是愚蠢的:)

来源

2011-07-17 19:06:35 Tomas

其实好主意，但错误的选择:)你应该写'.seperate'，不'＃ seperate'。 – Tadeck

只需添加你要分开任何风格，但做到这一点后

div{ 
     background:red; 
    }

例如：

.separate{ 
    background:blue; 
}

来源

2011-07-17 19:08:15 kleinohad

相当凌乱的解决方案，当涉及到只修改div的。为什么不'div.separate'而不是'.separate'？ – Tadeck

如果div-class被设置为div的唯一值，'div.separate'就没用了。 '.separate'就足够了，因为CSS选择器是从右向左解析的。所以客户端搜索'.separate'的所有匹配项，然后再搜索所有的div，然后只返回具有指定类的那些。这会减少CSS解析时间。并且首先设计所有div的样式，然后设计异常样式是CSS3之前的常见做法，但仍未得到浏览器的全面支持。这在@ Guffa的答案中有描述。 – feeela

你可以做这个由：

指定不同的背景颜色div.separate的div（这样，它不会被覆盖） - see proof in jsfiddle。
使用div:not(.separate)选择器，但仅支持CSS3（see more） - see proof in jsfiddle的浏览器支持。
使用JavaScript（例如jQuery框架）并使用CSS3选择器进行设置（这样可以在所有主流浏览器中使用） - see proof in jsfiddle。

但我建议解决方案没有。 1，因为它是跨浏览器并且不需要JavaScript。

来源

2011-07-17 19:08:52 Tadeck

来源：

$j('.not(.separate)>div').css({background:'red'});

你可以做这样的事情：

Negative CSS selectors

您可以用JavaScript的帮助下（例如使用jQuery）做

div { background: red; } 
.separate { background: white; }

您可以添加一个适当的风格类到你想成为红色的div。

来源

2011-07-17 19:08:54 evan

您可以为所有div的背景，然后用无背景的特定类中重写它：

div { background-color: red; } 
div.separate { background-color: transparent; }

来源

2011-07-17 19:09:01 Guffa

单独的CSS选择器

回答

相关问题