Sass/scss多重混音组合风格

我有一个（好的，真的有一些）Sass混合设置梯度背景（向后兼容什么的）。现在，我有一个元素，我想对它应用多个梯度。我可以通过用逗号分隔的列表设置background属性来直接实现这一点，但是如果我可以使用gradient mixin的多个应用程序来应用多个渐变，并将该属性作为公共分隔列表输出，那么我希望这样做

我想做的一个例子：

div.needs-two-backgrounds {
  @include gradient-mixin(90deg, $color-one 0, $color-two 100%);
  @include gradient-mixin(180deg, $color-three 0, $color-four 20%, $color-five 100%);
}

它（本质上）会发出这种

div.needs-two-backgrounds {
  background-image: linear-gradient(90deg, $color-one 0, $color-two 100%),
                    linear-gradient(180deg, $color-three 0, $color-four 20%, $color-five 100%);
}

在Sass中是否有某种方法可以做到这一点，或者它需要一个单独的库，或者对于这种语言来说是不可能的

编辑： 我根据答案构建了一个解决方案，并想与大家分享

@function linear-gradient-x($direction, $stops...) {
  @return linear-gradient($direction, $stops);
}

@function prefixed-background-image-list-x($prefix, $images) {
  $ret-val: ();

  @each $image in $images {
    $prefixed-image: #{$prefix}$image;
    $ret-val: append($ret-val, $prefixed-image, 'comma');
  }

  @return $ret-val;
}

@mixin background-image-x($backgrounds...) {
  background-image: prefixed-background-image-list-x("-moz-", $backgrounds);
  background-image: prefixed-background-image-list-x("-webkit-", $backgrounds);
  background-image: prefixed-background-image-list-x("-o-", $backgrounds);
  background-image: prefixed-background-image-list-x("ms-", $backgrounds);
  background-image: prefixed-background-image-list-x("", $backgrounds);
}

其用法与答案中的建议类似：

div.needs-two-backgrounds {
  @include background-image-x(
    linear-gradient-x(90deg, $color-one 0, $color-two 100%),
    linear-gradient-x(180deg, $color-three 0, $color-four 20%, $color-five 100%)
  );
}

---

希望这对某人有所帮助。

你所描述的方式是不可能的，但像这样的事情是可能的

div.needs-two-backgrounds {
    @include background-image(
        gradient(90deg, $color-one 0, $color-two 100%),
        gradient(180deg, $color-three 0, $color-four 20%, $color-five 100%)
    );
}

然后，您必须创建一个支持可变参数的mixin

背景图像

——请注意以下三点：

@mixin background-image($images...) {
    // do stuff here
}

然后应使用

梯度

函数替换/扩展

梯度mixin

。如何完成这一切的一个很好的起点是Compass项目的

背景图像

mixin：

---

对不起，我花了一点时间才重新开始测试。