CSS中的only-of-type选择器有何作用？

4 min read

CSS中的 :only-of-type 选择器用于匹配与其兄弟元素类型相同，且没有任何其他兄弟元素的唯一元素。该选择器只匹配没有同类型兄弟元素的元素。

例如，如果您想选择文档中唯一的p元素，可以使用以下CSS规则：

p:only-of-type {
  /* CSS样式规则 */
}

使用 :only-of-type 选择器的元素必须是其父元素的子元素。 例如，如果您想要选择页面上唯一的h1元素，您可以使用以下CSS规则：

body > h1:only-of-type {
  /* CSS样式规则 */
}

这将选择直接位于 body 元素下的唯一 h1 元素，而不管其是否有其他同类型的兄弟元素。