:not()有哪些？:not()的简略运用

本篇文章给大家介绍:not()有哪些？:not()的简略运用，让大家理解:not()是怎样运用的。有一定的参照 价值，有需要的伴侣可以参照 一下，但愿对你们有所帮忙。 本篇文章给大家介绍:not()有哪些？:not()的简略运用，让大家理解:not()是怎样运用的。有一定的参照 价值，有需要的伴侣可以参照 一下，但愿对你们有所帮忙。

:not()是CSS的一个否认伪类选中器。它是一个函数式伪类选中器，它可以将一个简略选中器（如下所示）作为参数，然后匹配一个或多个不由参数表示的元素。

能作为:not()参数的可以是下列任何一种的简略选中器：

1、标签选中器（例如p，span等）

2、类选中（例如.element，.sidebar等）

3、ID选中器（例如#header）

4、伪类选中器（例如:first-child，:last-of-type）

5、属性选中器（例如[type="checkbox"]）

6、通用选中器（*）

但是，通报给:not()的参数不克不及是伪元素选中器（例如::before和::after等）或另一个否认伪类选中器。

因而，下列是无效 :not()值：

/* 无效 */
p:not(:not(.same)) {}

p:not(:not(:last-child)) {}

:not(::first-letter) {}

a:not(::after) {}

从上面的示例可以看出，:not()不克不及被嵌套，例:not(:not(..))。它还不克不及被嵌套在:matches()伪类中，例：selector（:matches(:not(..))）。

如前所述，:not()选中器将匹配其参数中未由选中器表示的元素。所以，这条css语句：：

li:not(.new) {    
  /* 所有样式列表项，除了拥有新类的项以外*/
}

将选中除拥有.new类名称的列表项以外的所有列表项。

:not()选中是可链接更多的:not()选中。例如，下列内容将匹配article除ID以外的所有s #featured，然后将过滤掉拥有类名的文章.tutorial：

article:not(#featured):not(.tutorial) {    
     /* 格局化文章 */
}

:not()还可以与其他伪类和伪元素链接。例如，下列将.old运用::after伪元素增加“new！”单词以列出没有类名的项目：

li ：not（.old）:: after {     
   content：“New！” ;    
   color：deepPink;
}

注明：

:not()伪类选中允许写入无用的选中。例如:not(*)，它基本不代表任何元素将永远不会利用任何样式。

总结：以上就是本篇文章的全部内容，但愿能对大家的学习有所帮忙。

以上就是:not()有哪些？:not()的简略运用的细致内容，更多请关注 百分百源码网 其它相干文章！