有没有办法在SASS中使用@for
循环执行此操作?
.shadow {
text-shadow:
0 $cut-distance*1/5 0 $background-color,
0 $cut-distance*2/5 0 $background-color,
0 $cut-distance*3/5 0 $background-color,
0 $cut-distance*4/5 0 $background-color,
0 $cut-distance 0 $background-color,
0 (-$cut-distance)*1/5 0 $background-color,
0 (-$cut-distance)*2/5 0 $background-color,
0 (-$cut-distance)*3/5 0 $background-color,
0 (-$cut-distance)*4/5 0 $background-color,
0 (-$cut-distance) 0 $background-color,
$cut-distance*1/5 0 0 $background-color,
$cut-distance*2/5 0 0 $background-color,
$cut-distance*3/5 0 0 $background-color,
$cut-distance*4/5 0 0 $background-color,
$cut-distance 0 0 $background-color,
(-$cut-distance)*1/5 0 0 $background-color,
(-$cut-distance)*2/5 0 0 $background-color,
(-$cut-distance)*3/5 0 0 $background-color,
(-$cut-distance)*4/5 0 0 $background-color,
(-$cut-distance) 0 0 $background-color,
(-$cut-distance)*1/5 (-$cut-distance)*1/5 0 $background-color,
(-$cut-distance)*2/5 (-$cut-distance)*2/5 0 $background-color,
(-$cut-distance)*3/5 (-$cut-distance)*3/5 0 $background-color,
(-$cut-distance)*4/5 (-$cut-distance)*4/5 0 $background-color,
(-$cut-distance) (-$cut-distance) 0 $background-color,
(-$cut-distance)*1/5 $cut-distance*1/5 0 $background-color,
(-$cut-distance)*2/5 $cut-distance*2/5 0 $background-color,
(-$cut-distance)*3/5 $cut-distance*3/5 0 $background-color,
(-$cut-distance)*4/5 $cut-distance*4/5 0 $background-color,
(-$cut-distance) $cut-distance 0 $background-color,
$cut-distance*1/5 (-$cut-distance)*1/5 0 $background-color,
$cut-distance*2/5 (-$cut-distance)*2/5 0 $background-color,
$cut-distance*3/5 (-$cut-distance)*3/5 0 $background-color,
$cut-distance*4/5 (-$cut-distance)*4/5 0 $background-color,
$cut-distance (-$cut-distance) 0 $background-color,
$cut-distance*1/5 $cut-distance*1/5 0 $background-color,
$cut-distance*2/5 $cut-distance*2/5 0 $background-color,
$cut-distance*3/5 $cut-distance*3/5 0 $background-color,
$cut-distance*4/5 $cut-distance*4/5 0 $background-color,
$cut-distance $cut-distance 0 $background-color
}
我正在跳这样的事情
.shadow {
text-shadow:
@for $i from 1 through 5 {
0 $cut-distance*$i/5 $background-color,
0 (-$cut-distance)*$i/5 background-color,
...
}
}