css - 如何在SASS中声明双行变量？

我想拥有一个变量，该变量的斜率与SASS的后备时间相同。我该如何实现？

我想作为一个变量的代码：

#4568DC;
-webkit-linear-gradient(to right, #B06AB3, #4568DC);
linear-gradient(to right, #B06AB3, #4568DC);

换句话说，如何在一个变量中声明三个属性，以便在编译时将其变为三个属性。所以这样的输入：

background: $combined-variable

应该给出这样的输出：

background: #4568DC;
background: -webkit-linear-gradient(to right, #B06AB3, #4568DC);
background: linear-gradient(to right, #B06AB3, #4568DC);

最佳答案

您并不是真的想通过单个变量替换文本来解决问题。相反，请查看sass mixins，因为它们确实提供了您想要的行为。您可以像这样使用它们：

@mixin gradient($color) {
    background: $color;
    background: -webkit-linear-gradient(to right, #B06AB3, $color);
    background: linear-gradient(to right, #B06AB3, $color);
}

.my-rule {
    display: inline;
    @include gradient(#4568DC);
}

关于css - 如何在SASS中声明双行变量？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/50036800/