如何在LESS CSS中按字面意思传递mixin参数？

Question

这是我的混音：

.gradient (...) {
    background-image: -webkit-linear-gradient(@arguments);
    background-image: -moz-linear-gradient(@arguments);
    background-image: -ms-linear-gradient(@arguments);
    background-image: -o-linear-gradient(@arguments);
    background-image: linear-gradient(@arguments);
}

我正试图像这样使用它：

.gradient(top, #333333 0%, #282828 100%);

问题在于LESS正在删除所有逗号，因此输出如下所示：

background-image: linear-gradient(top #333333 0% #272727 100%);

是否有可能让LESS从字面上传递参数？或者，我该如何解决这个问题？

Answer 1

要实现您的目标，我认为您必须使用以下语法之一将@arguments作为文字字符串传递：

  

  

1. ~"top, #333333 0%, #282828 100%"

  

2. e("top, #333333 0%, #282828 100%")

  

语法~"value"和e("value")几乎相同。

然后你应该像这样打电话给.gradient( @arguments ) mixin：

  

.gradient( e("top, #333333 0%, #282828 100%") );