css - 似乎无法在 LESS 中连接两个变量

Question

我试图将两个变量 @a 和 @b 组合成一个字符串，变量值用逗号分隔。这是我的尝试:

p {
    @a: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    @b: 0 0 8px rgba(82, 168, 236, 0.6);
    box-shadow: ~"@{a}, @{b}";
}

输出:

p {box-shadow: [object Object],[object Object]}

预期:

p {box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6)}

我做错了什么？

Answer 1

我从评论中了解到您被引导到一个有帮助的答案。只是为了澄清为什么您的原始解决方案不起作用，那是因为您没有将变量定义为字符串。你需要这个(注意你的字符串周围的引号):

p {
    @a: "inset 0 1px 1px rgba(0, 0, 0, 0.075)";
    @b: "0 0 8px rgba(82, 168, 236, 0.6)";
    box-shadow: ~"@{a}, @{b}";
}