示例页面

在 CSS 中,:not() 伪类可以用来排除特定的元素,使其样式不作用于这些被排除的元素。如果你想用 :not() 排除多个元素,可以通过在括号内组合多个选择器来实现。

使用 :not() 排除多个元素的方法

:not() 本身只接受一个参数,但你可以通过以下方式排除多个不同的元素或类:

 链式使用 :not():连续写多个 :not(),每个排除一个条件。
例如,你想选中所有不是 .btn 也不是 .nav-item 的 div 元素:

div:not(.btn):not(.nav-item) { background: yellow; }

这个规则会应用到所有是 div、且没有 .btn 类、也没有 .nav-item 类的元素。  排除多种标签类型:比如你想对所有元素设置样式,但排除 p 和 span 标签:

*:not(p):not(span) { color: blue; }

 

这样除了 p 和 span 之外的所有元素文字都会变成蓝色。  结合类、ID 和标签名:你也可以混合不同类型的选择器进行排除。