css - 在带有LESS的字符串中使用函数

Question

我搜索了文档和 SO，但找不到我的查询的答案。将函数的结果包含在带有 LESS 的字符串中的正确方法是什么？

例如，我已经定义了一个变量，并且想将它变亮以获得一个盒子阴影。例如，这是我想做的：

.box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 2px lighten(@green, 10%)");

显然那是行不通的。在不为 定义特定变量的情况下，实现此目的的正确方法是什么lighten(@green, 10%)？

Answer 1

将它放在字符串之外应该可以工作。

@green: #0f0;
.box-shadow(@def) { box-shadow: @def; }

p {
  .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 2px" lighten(@green, 10%)) 
}

编译为

p {
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 2px #33ff33;
}