アニメーションの遅延内でのSASSとCSSのcalc（）の使用

Question

SASSを使用してアニメーションの遅延内で（CSS calc（）を使用して）計算しようとしていますが、計算の結果を出力していないようです計算そのもの）。

.home-slider-container .home-slider .each-slide svg .letter { 
    opacity: 0; 
    animation: svgAnimate 4s linear; 
} 

@for $i from 1 through 8 { 
    .home-slider-container .home-slider .each-slide svg .letter-#{$i} { 
     $test: calc(#{$i}/2); 
     animation-delay: #{$test}; 

    } 
} 

私は間違っていますか？

Answer 1

calc()はサス機能ではないためです。たとえば、rgba()のように、ちょうどcss functionです。 calcの結果は、ランタイム/クライアント側で行われます。これをSassレベルで計算したい場合は、$i/2のような式を書いてください。最後のcssは計算値を持ちます。ここでは、私はあなたのためにSASS参照してそれを見つけた：ちょうど罰金になりますあなたのforループでanimation-delay: $i/2;：http://sass-lang.com/documentation/file.SASS_REFERENCE.html#number_operations

は、あなたの質問に答えるために。