css 选择类的第一个,CSS选择器来选择给定类的第一个元素

CSS3提供了：第一个类型的伪类，用于选择与其兄弟姐妹相关的其类型的第一个元素。但是它没有一个类的第一类伪类。

作为解决方法，如果您知道其他.A元素的默认样式，则可以使用通用兄弟组合器〜的覆盖规则来应用样式。这样，你可以排除第一条规则“撤消”。

坏消息是〜是一个CSS3选择器。

好消息是，IE从IE7开始识别，就像CSS2的>所以如果你担心浏览器的兼容性，那么唯一的“主要浏览器”就是IE6。

所以你有这两个规则：

.C > * > .A {

/*

* Style every .A that's a grandchild of .C.

* This is the element you're looking for.

*/

}

.C > * > .A ~ .A {

/*

* Style only the .A elements following the first .A child

* of each element that's a child of .C.

* You need to manually revert/undo the styles in the above rule here.

*/

}

如何将样式应用于元素如下所示：

Content

Content

Content

Content

Content

Content

Content

Content

>此元素没有类A.没有应用规则。>此元素具有类A，因此应用第一个规则。然而，它没有任何其他这样的元素发生在它之前，〜选择器需要，所以第二个规则不被应用。>此元素具有类A，因此应用第一个规则。它也是在同一个父项下的同一个类的其他元素之后，由〜所要求的，所以第二个规则也被应用。第一条规则被覆盖。