:only-of-type

概述

CSS 伪类 :only-of-type 代表了任意一个元素，这个元素没有其他相同类型的兄弟元素。

Note: 根据原来的定义，被选择的元素必须具有父元素。直到 Selectors Level 4 开始，这个要求就不是必须的了。

语法

element:only-of-type { style properties }

Example

HTML

<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

main :only-of-type {
  color: red;
}

结果

规范

Specification Status Comment
Selectors Level 4
:only-of-type		 Working Draft No change.
Selectors Level 3
:only-of-type		 Recommendation Initial definition.

浏览器兼容性

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 1.0 3.5 (1.9.1) 9.0 9.5 3.2
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 2.1 1.0 (1.9.1) 9.0 10.0 3.2

参见