如何在CSS中使用:not()选择器_排除特定元素样式应用
:not()伪类用于选中不满足特定条件的元素，提升样式精确性。例如p:not(.special)选中非.special类的段落，input:not([disabled])选中未禁用的输入框；可链式排除多种情况如.user-item:not(.admin):not(.guest)，但不支持逗号分隔多选择器；常用于避免重复覆盖样式，增强代码可维护性。
CSS 中的 :not() 伪类选择器是一个非常实用的工具，它允许你为**不匹配某个条件的元素**应用样式。使用它可以避免为特定元素重复写覆盖样式，提升代码简洁性和可维护性。
基本语法与作用
:not(选择器) 会选中所有不满足括号内选择器条件的元素。括号中可以是标签名、类、ID、属性选择器等。
常见用法示例：-
p:not(.special)—— 选中所有不是 .special 类的段落 -
input:not([disabled])—— 选中所有未被禁用的输入框 -
:not(.hidden)—— 选中所有没有 .hidden 类的元素
排除特定类或状态的元素
当你想对一组元素统一设置样式，但希望跳过某些特殊情况时，:not() 非常有用。
例如：为所有按钮添加外边距，但排除“提交”按钮button:not(.submit) {
margin-right: 10px;
}
这样 .submit 类的按钮就不会有右边距，其他按钮都会应用该样式。
结合属性选择器排除特定情况
你可以用 :not() 排除具有特定属性的元素，比如链接中非外部链接的样式处理。
示例：只给内部链接加下划线a:not([href*="http"]) {
text-decoration: underline;
}
这
个规则会让所有 href 不包含 "http" 的链接（即站内链接）显示下划线，而外部链接不受影响。
链式使用多个 :not() 条件
可以通过连续使用 :not() 来排除多种情况。
例如：选中既不是 .admin 也不是 .guest 的用户项.user-item:not(.admin):not(.guest) {
opacity: 0.8;
}
注意：不能写成 :not(.admin, .guest)，因为 :not() 不支持逗号分隔的多重选择器（目前仅接受单个参数）。
基本上就这些。合理使用 :not() 能让你的 CSS 更加精准和灵活，特别是在构建组件样式时，能有效减少冗余代码。关键是理解它匹配的是“不符合条件”的元素，逻辑上取反即可。
