MDN wants to talk to developers like you: https://qsurvey.mozilla.com/s3/8d22564490d8

:not()

概述

CSS否定伪类,:not(X),是以一个简单的X选择器为参数的功能性标记函数。它匹配不符合参数选择器X描述的元素。X不能包含另外一个否定选择器。

:not伪类的优先级即为它参数选择器的优先级。:not伪类不像其它伪类,它不会增加选择器的优先级。

注意:
  • 利用这个伪类可以写一个完全没有用处的选择器。 例如, :not(*) 匹配任何非元素的元素,因此这个规则将永远不会被应用。
  • 利用这个伪类可以重写其它规则。 例如, foo:not(bar) 和foo将匹配同样的元素。 但是前者的优先级更高。
  • :not(foo){} 将匹配任何非foo元素,包括html和body。
  • 这个选择器只会应用在一个元素上, 你不能用它在排除所有祖先元素。 举例来说, body :not(table) a 将依旧会应用在table内部的<a> 上, 因为 <tr>将会被:not() 这部分选择器匹配。

语法

:not(selector) { 样式属性 }

例子

用法示例

p:not(.classy) { color: red; }
body :not(p) { color: green; }

.将上述CSS应用在下面这段HTML上...

<p>Some text.</p>
<p class="classy">Some other text.</p>
<span>One more text<span>

结果将是:

规范

Specification Status Comment
Selectors Level 4
:not()
Working Draft 为允许更复杂的选择器扩展参数
Selectors Level 3
:not()
Recommendation 初始定义

浏览器兼容性

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
基础支持 1.0 1.0 (1.7 or earlier) 9.0 9.5 3.2
扩展参数 未实现 未实现 未实现 未实现 未实现
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
基础支持 2.1 1.0 (1) 9.0 10.0 3.2
扩展参数 未实现 未实现 未实现 未实现 未实现

 

文档标签和贡献者

 此页面的贡献者: nick-ChenZe, FredWe
 最后编辑者: nick-ChenZe,