CSS3 的 `:first-of-type` 选择器可以定位特定类的第一个实例吗？

CSS3 :first-of-type 选择器可以选择特定的类名吗？

虽然 CSS3 :first-of-type 选择器可以选择特定类型（例如 div、p）的第一个元素，不能单独使用它来定位类名的第一次出现。这是因为将类选择器（或类型选择器）与 :first-of-type 一起使用意味着选择一个元素：

• 具有指定的类（或类型）
• 是它的兄弟元素中该类型的第一个元素

但是，CSS 中没有固有的 :first-of-class 选择器专门选择第一个类的实例。

解决方法

要实现此功能，可以采用解决方法：

.myclass1 { color: red; }
.myclass1 ~ .myclass1 { color: /* default or inherited from parent */; }

此解决方法利用相邻的同级组合器 (~) 对除第一个之外的所有出现的 .myclass1 进行样式设置。第一个 .myclass1 将从其父 div 继承其颜色（或默认为浏览器默认值）。

有关此解决方法的更多见解和视觉插图，请参阅：

• [W3Schools ：使用孩子和兄弟姐妹选择器](https://www.w3schools.com/css/sel_combinators.asp)
• [CSS 技巧：设计第一个兄弟姐妹的样式](https://css-tricks.com/styling-first-sibling /)

以上是CSS3 的 `:first-of-type` 选择器可以定位特定类的第一个实例吗？的详细内容。更多信息请关注PHP中文网其他相关文章！