LESS变量代换(LESS Variable Interpolation)

我试图通过使用函数和变量代换居然还比我已经有LESS简化我的CSS。 我是完全不知道的变量代换，直到我看了看Hover.css'少文件，这是毫不奇怪，为什么我现在搞砸了。

我工作在Reddit上做出的天赋系统，我使用的变量插值遇到问题。

我目前使用下面的测试：

.flair.flair-one { color: red; }
.flair.flair-two { color: green; }
.flair.flair-three { color: blue; }

.custom(@a; @b; @c) {
  &::before { .flair.flair-@{a}; }
  .flair.flair-@{b};
  &::after { .flair.flair-@{c}; }
}

.this-flair {
  .custom(one; two; three);
}

这就是我在做什么的基本结构。 虽然在网上编译器测试， .this-flair不工作。

就是有人能告诉我，我能做些什么来解决这个问题？ 我期待通过较少的功能，它看起来好像这是做正确的方式。

Answer 1:

正如在评论中提到上面你不能既插值或混入函数调用。 在快速浏览，参数混入（与模式匹配）是什么，你真正需要使用这样的片段：

.flair-flair(one)   {color: red}
.flair-flair(two)   {color: green}
.flair-flair(three) {color: blue}

.custom(@a, @b, @c) {
    .flair-flair(@b);
    &::before {.flair-flair(@a)}
    &::after  {.flair-flair(@c)}
}

.this-flair {
    .custom(one, two, three);
}

文章来源: LESS Variable Interpolation