:not()选择器可排除特定元素以简化样式设置，如p:not(.special)排除特殊类段落，input:not([disabled])选中非禁用输入框，结合:first-child等可精准控制中间列表项或普通按钮，常用于表单边框、标题间距及网格布局间隔设置，提升代码简洁性与维护性。
CSS 的 :not() 选择器是一个非常实用的伪类，它允许你选中**不匹配某个条件的元素**。这意味着你可以轻松地为一组元素设置样式，同时排除特定的个别元素，而无需额外添加类名或使用更复杂的选择器结构。
基本用法：排除特定类或标签
:not() 接受一个简单选择器作为参数，比如类名、ID、属性、类型等。常见用法如下：
- p:not(.special) —— 选中所有不是 .special 类的段落
- input:not([disabled]) —— 选中所有未被禁用的输入框
- *:not(span) —— 选中页面中除了 span 以外的所有元素（谨慎使用）
组合使用：提升选择灵活性
你可以将 :not() 与其他选择器结合，实现更精确的控制。例如：
- .list-item:not(:first-child):not(:last-child) —— 只选中列表中间项，用于添加分隔线时避免首尾重复
- button:not(.primary):not(.danger) —— 给普通按钮设置默认样式，排除已定义样式的特殊按钮
- a:not([href^="https://"]) —— 高亮非 HTTPS 外链，提醒安全风险
实用场景：简化代码结构
在实际开发中，:not() 能减少冗余类名，让 HTML 更简洁：
立即学习“前端免费学习笔记（深入）”；
- 表单中统一设置边框，但跳过提交按钮：
input:not([type="submit"]) { border: 1px solid #ccc; } - 文章内容中所有标题加 margin，但跳过第一个标题避免顶部空白：
article h2:not(:first-of-type) { margin-top: 1.5em; } - 网格布局中，给子元素设间隔，但排除最后一行底部或最右列右侧：
.grid > *:not(:nth-last-child(-n+3)) { margin-bottom: 10px; }
基本上就这些。:not() 是个轻量却强大的工具，合理使用能让 CSS 更清晰、更易维护。注意它不支持复合选择器或嵌套 :not()（如 :not(.a .b) 是无效的），但现代浏览器对它的支持已经非常完善。
