CSS选择具有特定类的第一个元素

Question

选择某个类的第一个元素的语法是什么？请指定该选择方法是 CSS3 还是 CSS2.1 的一部分。

Answer 1

如果您需要在其 sibling 中具有特定类的第一个元素，您可以使用

.myclass {
    /* styles of the first one */
}

.myclass ~ .myclass {
    /* styles of the others (must cancel the styles of the first rule) */
}

不要尝试使用 .myclass:not(.myclass ~ .myclass) 仅在一个规则中执行此操作，因为 :not() 只接受括号中的简单选择器。

如果你想要整个文档中的第一个.myclass，光靠CSS是没办法的。

发布的 :nth-of-type() 或 :nth-child() 方法是错误的，即使它们恰好与您想要的元素匹配你的页面。

兄弟选择器 (~) 的浏览器支持:IE7+ 和所有其他浏览器。