Mixin背景渐变与background image.png

Question

我有一个或多或少宣称的mixin

@mixin color-background {
  background: yellow;
}

我希望使用这种颜色作为png的背景。但我似乎无法混合两个

现在我想做的是例如

.myImageWithBackgroundColor{
    background: url(image.png),@include color-background
}

我如何用SASS和mixin来实现这个目标？

Answer 1

您可以将mixin的背景值存储到变量中，然后在第二个代码段中使用变量而不是整个mixin。

$my-color: yellow;

@mixin color-background {
    background: $my-color;
}

.myImageWithBackgroundColor{
    background: url(image.png) $my-color;
}