首页 文章

我可以在sass中创建我的classname变量吗？

提问于
浏览 次
0

是否可以在sass中创建一个classname变量 . 如果是这样，我该如何做以下事情：

$colorlist();

$blue:    #007bff;
$yellow:  #99s9e0;
$red:  #f4i304;

$colorlist: map-merge((
 "blue":   $blue,
 "yellow":  $yellow,
 "red":     $red,
)
$colorlist
);

现在我想写HTML类：“bg-blue”bg是一个类，它为元素提供由' - '符号后面的颜色定义的背景颜色 .

目前我有这个：

$red:  #900;
$colorlist();
$colorlist: map-merge(
                (
                       "color1": $red,
                ),
                $colorlist
);


.bg-#{$colorlist} {
  background-color: $colorlist;
}

提出了ReSedano的建议

$red:  #900;
$colorlist();
$color();
$colorlist: map-merge(
                (
                       "color1": $red,
                ),
                $colorlist
);


.backg-#{$color} {
  background-color: map_get($colorlist,$color);
}
sass

1 回答

  • 1

    试试这种方式：

    $red:  #900;
$colorlist:();
$color:();
$colorlist: map-merge(
   (
      red: $red,
    ),
  $colorlist
);

@mixin background($color){
  .backg-#{$color} {
    background-color: map-get($colorlist,$color);
  }
}


@include background(red);

    你的输出将是这样的：

    .backg-red {
  background-color: #900;
}
    回复于

相关问题