问题描述
除了当我尝试将 $gradient
传递给 @include background-image
时,以下代码都有效.
The following code works except for when I try to pass the $gradient
to @include background-image
.
@mixin compositeFill($size: 100px, $gradient:(top, #000000 0%, #FFFFFF 100%)) {
$isTop: nth($gradient, 1) == "top";
$direction: if($isTop, vertical, horizontal);
$widthHeight: if($isTop, height, width);
$heightWidth: if($isTop, width, height);
// snipped a whole bunch of irrelevant stuff
// this is what fails:
@include background-image(linear-gradient($gradient));
}
如何将列表(例如 $gradient
)传递给需要多个参数的 mixin?
How to pass a list (e.g. $gradient
) to a mixin that expects multiple arguments?
推荐答案
要将参数列表传递给接受多个参数的 mixin,您可能希望像这样使用它:
To pass a list of parameters to a mixin that accepts multiple parameters you would want to use it like this:
@include background-image(linear-gradient($gradient...));
三个点 表示您要填充列表元素中的参数……否则整个列表将作为单个参数传递……而 linear-gradient()
mixin 失败(因为它需要至少两个颜色停止参数).
the three dots indicate that you want to fill in the arguments from the list elements ... otherwise the whole list is passed as a single argument ... and the linear-gradient()
mixin fails (as it expects at least two color stop arguments).
这篇关于将列表元素作为参数传递给 mixin的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!