less 中不存在 .merge() 函数，仅支持 + 操作符对 background、border、font 等少数复合属性进行值追加，且存在顺序敏感、兼容性差、调试困难等问题，推荐用 mixin 或变量数组替代。
Less 合并属性 .merge() 并不存在
Less 没有叫 .merge() 的函数或语法。你搜到的“合并属性”大概率是指 +（加号）合并操作符，它只在特定场景下生效，且极易误用。
这个操作符不是通用的“合并任意 CSS 属性”，而是专为 background、border、font 等复合属性设计的语法糖，底层依赖 Less 对这些属性的硬编码解析逻辑。
- 写
background+: url(a.png);会拼进已有background声明里 - 但
color+: red;直接报错 ——color不支持合并 - 自定义属性如
--foo+: 12px;同样不支持，编译失败
哪些属性真正支持 + 合并？
Less 官方文档明确列出的支持列表很小，仅限于浏览器原生允许“多值叠加”的复合属性，且必须是标准全名（不能是缩写变体）：
-
background（注意：不是background-image或bg） -
border、border-top、border-right等带方向的边框属性 -
font（仅限完整 font shorthand，如font: 14px/1.5 "sans";） -
outline、box-shadow、text-shadow -
transform（Less 3.5+ 支持，但需确保各 transform 函数名拼写准确）
常见误区：margin+ 或 padding+ 看似合理，但 Less 不支持 —— 它们不是单值复合属性，编译时直接忽略 + 或报错。
立即学习“前端免费学习笔记（深入）”；
+ 合并的实际效果和陷阱
它不是字符串拼接，而是按 CSS 规范将新值追加到旧值末尾，并用逗号分隔（对 box-shadow）或空格分隔（对 background）。这导致几个关键问题：
- 顺序敏感：后写的
background+: #fff;会出现在前面声明的background值之后，可能被覆盖 - 无法控制层级：比如两个
box-shadow+: 0 2px 4px rgba(0,0,0,0.2);会生成两个阴影，但无法指定哪个在上 - 兼容性断层：Less 4.0 移除了对部分属性（如
font+）的支持，升级后原有代码可能突然失效 - 调试困难：编译后的 CSS 里看不到 “+” 符号，只能靠比对输出猜哪行触发了合并
示例：
@base: background: linear-gradient(to right, #000, #fff);<br>div {<br> @base;<br> background+: url("icon.svg") no-repeat left center;<br>}编译结果是：
background: linear-gradient(to right, #000, #fff), url("icon.svg") no-repeat left center;
替代方案比死磕 + 更可靠
绝大多数所谓“需要合并”的场景，其实更适合用 Mixin + 参数默认值、或变量数组 + each() 循环处理：
- 多背景图？用
@bg-list: url(a.png), url(b.png), linear-gradient(...); background: @bg-list; - 动态边框组合？写
.border-mixin(@width: 1px, @style: solid, @color: #000) { border: @width @style @color; }，再叠加调用 - 需要条件追加？用 guard 判断：
.shadow(@s) when (isstring(@s)) { box-shadow+: @s; }
Less 的 + 是个窄口径、高风险的语法特例。它解决的问题有限，引入的维护成本却很高 —— 尤其当团队里有人把它当成“CSS 属性万能追加器”时，后续排查会非常痛苦。
