SASS:循环内部属性

时间:2018-02-23 09:06:56

标签: css sass

我想为单个属性生成多个值:

dataType:jsonp
cross origin

我试图通过这样做来实现这一目标:

background-image:
    radial-gradient(circle, $primary 10%, transparent 10%),
    radial-gradient(circle, $primary 10%, transparent 10%),
    radial-gradient(circle, $primary 10%, transparent 10%),
    radial-gradient(circle, $primary 10%, transparent 10%);

然而,这不起作用。任何帮助将不胜感激!

1 个答案:

答案 0 :(得分:0)

之前只需声明一个变量,并在所有逻辑之后使用它。

顺便说一句,您也可以使用$i$color#{$i}等颜色进行游戏。

.gradient{
  $color1: #000;
  $color2: #fff;
  $background: null;

  @for $i from 1 through 4 {
      $background: $background radial-gradient(circle, $color1 10%, $color2 10%)#{if($i !=4, ',', '')};
  }

  background-image: $background;
}