如何通过全匹配原则理解Less混合继承，防止CSS样式冲突混乱？

本文共计1346个文字，预计阅读时间需要6分钟。

在CSS中，使用`all`选择器时，`.btn-primary:extend(.btn)`只会合并`.btn`自身的样式声明，而不会包括嵌套生成的样式，如`.btn:hover`或`.btn.is-active`。这意味着，尽管按钮的正常状态样式被保留，但悬停或激活状态下的样式将完全丢失。结果是，按钮在交互时不会显示预期的视觉效果——表面上看起来代码没有报错，但实际上交互效果失效。

常见错误写法：.icon-warning:extend(.icon)；正确写法：.icon-warning:extend(.icon all)。只有加了 all，编译器才会递归扫描 .icon 下所有嵌套路径（包括伪类、属性选择器、子代组合器），并把它们一一与扩展者拼接。

• 不加 all → 仅匹配字面选择器，安全但残缺
• 加 all → 匹配全部衍生选择器，完整但易爆炸
• 调试技巧：临时删掉 all，对比编译前后 CSS 文件大小和选择器数量，能立刻看出是否漏了状态

extend 不跨文件生效，@import 顺序决定一切

extend 是静态解析，只在当前编译上下文里找已声明的选择器。