CSS

:only-of-type

:only-of-type

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

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

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

语法

:only-of-type

实例

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; }

结果

规范

SpecificationStatusComment
Selectors Level 4The definition of ':only-of-type' in that specification.Working DraftMatching elements are not required to have a parent.
Selectors Level 3The definition of ':only-of-type' in that specification.RecommendationInitial definition.

浏览器兼容性

FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support1.0(Yes)3.5 (1.9.1)9.09.53.2

FeatureAndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support2.1(Yes)1.0 (1.9.1)9.010.03.2