如何排除一类的样式定义所有儿童(How to exclude a class with all ch

我有这样一个文件

<div>
 <div class="abc">
  <div>
   <!--some more divs inside-->
  </div>
 </div>
</div>

我想要做的就是款式只适用于第一个div。我试图用div:not(.abc, .abc *) div:not(.abc):not(.abc *) div:not(.abc), div:not(.abc) *但没有这些工作。这将是很难编辑HTML，因为会有很多的文件进行编辑。此外上面显示的代码出现在不同的地方，因此，使用>选择是解决不了问题...是否有人知道如何做到这一点？

Answer 1:

你不能可靠地使用:not()选择在CSS排除元素和/或其后代。其原因是在解释这个答案（和其他一些人认为它链接到）：

您不能使用组合程序。这部作品在jQuery的，但不是CSS：
 /* * Grab everything that is neither #foo itself nor within #foo. * Notice the descendant combinator (the space) between #foo and *. */ :not(#foo, #foo *) 
这是一个特别讨厌的，主要是因为它没有适当的解决方法。有一些松动解决方法（ 1和2 ），但它们通常依赖于HTML结构，并且因此非常实用中受到限制。

而且，由于您的标记是足够不可预测的，你不能编辑或使用>选择，恐怕没有太多的出路，你比任何其它找到一种方法，一类适用于您的顶div和使用该类作为由Fluidbyte证明，和/或使用jQuery，如上文暗示的。

Answer 2:

我通常会发现它更容易包括您通过一类需要什么，然后尝试排除后代元素。看到这里的小提琴： http://jsfiddle.net/cLtHg/

这需要照顾的继承问题，是更跨浏览器友好。

Answer 3:

如果你真的不触及HTML，那么简单的，虽然脏的办法是款式可供后续的div适用于第一个div，然后删除它们，就像这样：

div {margin-bottom: 20px; border: 1px solid #ccc;}
div div {margin-bottom: 0; border: none;}

这里的主要缺点是，在孩子的div一些风格可能会无意中删除。取决于他们如何在首位风格。

Answer 4:

使用:first-child与其父元素的ID或类。如果您无法赶上使用CSS的元素，故建议使用JavaScript或jQuery的 。

Answer 5:

您是否尝试过:first-child或:nth-child() selecor？

文章来源: How to exclude a class with all children in style definition