sass - 带有可变参数的指南针背景混合

Question

这是我要完成的一个非常简化的测试用例：

这有效：

html
  $gradient: red, salmon
  +background(linear-gradient($gradient))

这不起作用：

html
  $gradient: top, red, salmon
  +background(linear-gradient($gradient))

它给了我这个错误：“ At least two color stops are required for a linear-gradient()”

然而，$gradient: top, red 10%, salmon 10%行不通。也没有$gradient: 35% 10%, red 10%, salmon 10%。我需要能够将渐变语法的任何有效 CSS3 组合传递给 mixin，甚至是多个渐变。

+background(linear-gradient(35% 10%, red 10%, salmon 10%))有效，所以我认为它也应该使用变量占位符。

我怎样才能+background接受我通过的任何有效的 CSS？

Answer 1

使用 Sass变量参数：

html
  $gradient: top, red, salmon
  +background(linear-gradient($gradient...))

Answer 2

html
  $gradient: linear-gradient(top, red, salmon)
  +background($gradient)

这适用于我正在尝试做的事情，但如果我需要一个 mixin 来始终是一个线性渐变，这并不理想或非常干燥。