想知道是否可以在 Sass 中使用数组,因为我发现自己在重复以下类型的事情:
.donkey
h2
background-color= !donkey
.giraffe
h2
background-color= !giraffe
.iguana
h2
background-color= !iguana
绝对地。
$animals: "donkey", "giraffe", "iguana"
@foreach $animal in $animals
.#{$animal}
h2
background-color: !#{$animal}
不,这是不可能的。最好的方法是定义一个mixin:
+animal-h2(!name, !color)
.#{name} h2
background-color= !color
然后,您可以为每种样式设置一行,而不是三行:
+animal-h2("donkey", !donkey)
+animal-h2("giraffe", !giraffe)
+animal-h2("iguana", !iguana)
nex3 的回答是正确的。为了让它与 SASS on Rails 3.1 一起工作,我需要在 css.scss 文件中包含以下内容:
$donkey: #CC4499;
@mixin animal-h2($name, $color) {
.#{$name} h2 {
background-color: $color;
}
}
@include animal-h2("donkey", $donkey);
@include animal-h2("horse", #000);
哪个输出:
.donkey h2 {
background-color: #CC4499;
}
.horse h2 {
background-color: black;
}