less循环操作

• less循环与js的while语句横向式,其实就是一个递归函数配合when函数一起使用,当满足条件将会停下来

.loop(@counter) when (@counter > 0) {
    width: (10px * @counter); // 一些属性的设置
    .loop(@counter - 1)
  }
  
div {
    .loop(5); // launch the loop
}

.item{                               
    .item(@counter) when (@counter >0 ) {
        &:nth-child(@{counter}) {
            background: url("../assets/images/eleFile/item-@{counter}.png") center no-repeat;
            &.acative, &:hover { 
                background: url("../assets/images/eleFile/item-@{counter}-on.png") center no-repeat; 
                span{
                    color: #fff; 
                }
            }
        }
        .item(( @counter - 1 ));// 递归调用自身
    }
    .item(10);
 }