SASS或LESS关键帧百分比循环 [英] SASS or LESS Keyframes percentage loop

问题描述

我正在测试一些特殊的东西，并且试图在关键帧内循环以将百分比动态地写入其中.

I'm testing something special and I'm trying to loop inside keyframes to dynamically write percentages into it.

我已经用SASS测试了类似的东西，但是它不起作用.

I've tested something like that with SASS but it doesn't work.

@keyframes test{

    @for $i from 0 through 100 {
        #{$i}% {
            //do special stuff
        } 
        $i: $i + 1;
    }

我希望它输出:

@keyframes test{
    0%{
          ...
    }
    1%{
          ...
    }
    2%{
          ...
    }
    3%{
          ...
    }
    ...
}

但是我知道了

Error on line number: 23. Invalid CSS after "    #{$i}%": expected placeholder name, was " {"

我已经在LESS中对此进行了测试，但是它也不起作用.

I've tested this in LESS and it doesn't work either.

    @a: 0%;

    @keyframes test{

       .func (@a, @b, @c);

    }

    .func (@a, @b, @c) when (@a < 100%){  
        (@a){
            //do special stuff
        }

        .func (@a+1, @b, @c);
    }

有人可以帮助我吗?

推荐答案

如果您像这样摆弄它，它将起作用:

It will work if you finagle it like this:

@keyframes test {
  @for $i from 0 through 100 {
    #{$i * 1%} {
      // do special stuff
    } 
  }
}

这篇关于SASS或LESS关键帧百分比循环的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！