首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

:only-of-type

:only-of-typeCSS伪类表示不具有相同类型的同胞元素的元素。

代码语言:javascript
复制
/* Selects each <p>, but only if it is the */
/* only <p> element inside its parent */
p:only-of-type {
  background-color: lime;
}

注意:如最初定义的那样,所选元素必须有一个父元素。但从选择器级别4开始,这不再是必需的。

语法

代码语言:javascript
复制
:only-of-type

实例

HTML

代码语言:javascript
复制
<main>
  <div>I am `div` #1.</div>
  <p>I am the only `p` among my siblings.</p>
  <div>I am `div` #2.</div>
  <div>I am `div` #3.
    <i>I am the only `i` child.</i>
    <em>I am `em` #1.</em>
    <em>I am `em` #2.</em>
  </div>
</main>

CSS

代码语言:javascript
复制
main :only-of-type {
  color: red;
}

结果

规范

Specification

Status

Comment

Selectors Level 4The definition of ':only-of-type' in that specification.

Working Draft

Matching elements are not required to have a parent.

Selectors Level 3The definition of ':only-of-type' in that specification.

Recommendation

Initial definition.

浏览器兼容性

Feature

Chrome

Edge

Firefox (Gecko)

Internet Explorer

Opera

Safari

Basic support

1.0

(Yes)

3.5 (1.9.1)

9.0

9.5

3.2

Feature

Android

Edge

Firefox Mobile (Gecko)

IE Mobile

Opera Mobile

Safari Mobile

Basic support

2.1

(Yes)

1.0 (1.9.1)

9.0

10.0

3.2

扫码关注腾讯云开发者

领取腾讯云代金券