scss 这种css有什么简便写法?

源代码

li{
  &:nth-child(1){
    animation-delay: 0;
  }
  &:nth-child(2){
    animation-delay: 0.2s;
  }
  &:nth-child(3){
    animation-delay: 0.4s;
  }
  &:nth-child(4){
    animation-delay: 0.6s;
  }
}         
阅读 1.9k
2 个回答
li {
  @for $i from 0 through 3 {
    &:nth-child(#{$i+1}) {
      animation-delay: 0.2s * $i;
    }
  }
}

image.png

@for $i from 1 to 7 {
   li:nth-child(#{$i}) {
    animation-delay: #{($i - 1) * 0.2}s;
  }
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题