不能。伪类如:hover和:disabled不可连写，因状态互斥且语法非法；正确组合需用:not()逻辑排除，如button:not(:hover):not(:disabled)。
伪类能连着写吗？:hover和:disabled能不能一起用
不能。CSS伪类不支持“链式组合”这种写法，比如:hover:disabled在规范里是非法的——浏览器会直接忽略整个选择器。这不是兼容性问题，是语法错误。CSS伪类本质是互斥的状态描述：一个元素不可能同时处于“悬停中”和“被禁用”状态（disabled元素不响应:hover），所以浏览器压根不解析这种组合。
真正能叠加的只有伪元素（如::before）和部分可共存伪类（如:not()内部嵌套），但那是逻辑嵌套，不是链式拼接。
:not()是唯一靠谱的“组合”出口
想表达“既不是 hover 又不是 disabled”，得靠:not()做逻辑排除，而不是连写。它接受一个完整选择器作为参数，所以可以嵌套、可以多层，但必须合法。
-
button:not(:hover):not(:disabled)✅ 合法，表示“非悬停且非禁用”的按钮 -
input:not([type="submit"]):not(:focus)✅ 合法，排除特定 type 和 focus 状态 -
a:hover:not(.external)✅ 常见用法：只对非 external 类的链接启用 hover 样式 -
div:not(:first-child):not(:last-child)✅ 选中间所有 div，但注意：伪类顺序不影响结果，:not()内不能写多个伪类（如:not(:first-child:last-child)❌）
想实现“hover 时禁用态的样式”？别骗自己了
这种需求背后往往混淆了交互逻辑和视觉反馈。真实场景中：disabled元素不会触发:hover，所以button:disabled:hover永远不生效。如果你看到它“有效”，大概率是用了pointer-events: none之类的手动禁用，而非原生disabled属性。
正确做法是换思路：
- 用 class 模拟禁用态，比如
.is-disabled，再写button.is-disabled:hover - 用 JavaScript 监听
mouseenter，动态加 class，避开 CSS 状态冲突 - 如果必须用原生
disabled，那就放弃 hover 样式——这是浏览器行为，改不了
性能与兼容性：别在:not()里塞太重的选择器
:not()本身不慢，但它里面的子选择器会照常计算。比如ul li:not(li:nth-of-type(2n))，浏览器仍要先匹配所有li，再逐个判断:nth-of-type，开销翻倍。
更隐蔽的坑是兼容性：:not()支持多参数（如:not(.a, .b)）是 CSS4 新增特性，IE 完全不支持，Chrome 59+、Firefox 52+ 才稳定。老项目里务必拆成两个:not()：
/* ❌ 不兼容 IE / 旧 Chrome */ input:not(.error, .success) <p>/<em> ✅ 兼容性更好 </em>/ input:not(.error):not(.success)</p>
复杂选择器越靠近 DOM 树末端，重绘成本越高。真要精确命中，优先用 class 或 data 属性，比堆砌伪类靠谱得多。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
