这一节，我们将学习LoopinLess。循环在编程语言中应该很常见。一般的编程语言都有循环。比如JavaScript中有for循环和while循环，但是在Less中不存在这两种语法，而是通过调用自身来实现循环。循环的使用在Less中，mixin可以调用自身。当mixin递归调用自身时，结合guard表达式和模式匹配的两个特点，可以写出一个循环结构。例子：比如循环输出四个padding属性：.loop(@i)when(@i>0){.loop((@i-1));//递归调用自身padding:(10px+5*@i);}.call{.loop(4);//调用循环}编译成CSS代码：.call{padding:15px;填充：20px；填充：25px；padding:30px;}下面分析一下上面的Less代码：先看第一行，是条件判断的混合体，之前学过。.loop有一个参数@i，当满足条件@i>0时，可以执行大括号内的代码。那么.loop((@i-1))的意思就是调用mix本身，参数值减一。这一步只要满足条件就会执行，一直执行到@i>0。最后在.call中调用.loop，给参数@i赋值，因为要求是循环输出padding属性四次，因此您可以将值4分配给@i参数。通过循环创建多个样式类使用递归循环的最常见用例是为网格系统生成CSS。示例：.xkd(@n,@i:1)when(@i=<@n){.grid@{i}{宽度：(@i*100%/@n);}.xkd(@n,(@i+1));}.xkd(5);编译成CSS代码：.grid1{width:20%;}.grid2{width:40%;}.grid3{width:60%;}.grid4{width:80%;}.grid5{width:100%;}上面代码中.xkd一共循环了五次，每次循环都会创建一个.gird@{i}样式类。有时候，在实际项目中，我们往往会把字体、颜色、边距等样式作为公共样式放在一个公共文件中，然后再定义一些列样式，比如字体大小定义12px、14px、16px等，这样会比较麻烦一个一个写。如果你使用循环，你可以用几行代码来实现它：.font(@i)when(@i<=28){f@{i}{font-size:@i+0px;}.font((@i+2));}.font(12);编译成CSS代码：f12{font-size:12px;}f14{font-size:14px;}f16{font-size:16px;}f18{font-size:18px;}f20{font-size:20px;}f22{font-size:22px;}f24{font-size:24px;}f26{font-size:26px;}f28{font-size:28px;}总结这一节我们主要学习了Less中的循环。循环在编程语言中很常见，我们可以通过循环来减少代码量。有时大段相似的代码可以通过循环几行代码来实现。链接：https://www.9xkd.com/
