@list: apple, pear, coconut, orange;
p{
value: extract(@list, 3);
}

//计算下面的li运动时间持续增加

批量获取宽度百分比

主要应用于一行百分比的图片内容！ 一个一个计算麻烦！如下面图解！只需要把实际宽度在j4wd列出！则可以生成一批j4-@i的css 计算好百分比宽度的内容！

.j4-zt{

.j4-wd();

//定义宽度百分比函数  
@j4wd:697,490,248,248,342,342,490,512;
@j4:length(@j4wd);
.j4-wd(@i: 1) when (@i =< @j4) {
  .j4-@{i}{
       width: unit(extract(@j4wd, @i)/1920,%);
  }
  .j4-wd((@i + 1));
}
}

获取运动

.li-yundong(@n,@c:.2s, @i: 1) when (@i =< @n) {
  li:nth-child(@{i}) {
   .transition(.6s @c);
  }
  .li-yundong(@n,(@c+ .1), (@i + 1));
}

设置背景图

@ljs :"../images/banner_";//固定一个路径
.bjt(@n,@i:1,@c:@ljs) when (@i =< @n) {//增加变量n判断需要生成几个
   &:nth-child(@{i}) {
   background-image:url('@{c}@{i}.jpg');
  }
  .bjt(@n,(@i + 1),@c);///i加1
}
  @media screen and (max-width: 900px){//兼容1200宽度的边距
    @ljss :"../images/sb_";//固定一个路径
}

设置左右

.zy(@a,@b:20px,@c:70px,@f:-70px,@d:#133682,@e:#133682){//@a为名字  @b 为宽度  @c 为高度 @d为颜色@e为鼠标移动上去颜色
   .@{a}-prev,.@{a}-next{ position: absolute; top: 50%; margin-top: -35px;width: @b;height: @c;z-index: 99;
  &:before,&:after{position: absolute;.transition(.8s .0s);content: "";width: 200%;height: 2px; background: @d; }
    &:hover{
        &:before,&:after{
            background: @e;
        }
    }
}
.@{a}-prev{ left: @f;  cursor: pointer; 
    &:before{.transform-origin(right top); right: 0;top: 0;.rotate(-60deg); }
    &:after{.transform-origin(right top);  right: -2px;bottom:0px;.rotate(60deg); }
}
.@{a}-next{ right: @f;     cursor: pointer;  position: absolute; top: 50%;
    &:before{  .transform-origin(left top); left: 0;top: 0px;.rotate(60deg); }
    &:after{ .transform-origin(left top);  left: -2px;bottom:0px;.rotate(-60deg); }
}
 
}

选择变量颜色

@tag-color: #ffc000, #7ac52c, #ff6d00,#1cbac6,#a062e1,#79c62c,#479ff9,#4782f8,#4cc20c,#f35eaf;//定义颜色变量
@n:length(@tag-color);
.tag-menu-ys(@i: 1) when (@i =< @n) {
  &:nth-child(@{i}) {
       i{background: extract(@tag-color, @i); }
  }
  .tag-menu-ys((@i + 1));
}

less  根据颜色设置颜色

.zibj (@a) when (lightness(@a) >= 50%) { //假设@的颜色比较浅色 则背景为黑色
  background-color: black;
}
.zibj (@a) when (lightness(@a) < 50%) {//假设@的颜色比较深色 则背景为白色
  background-color: white;
}
.zibj (@a) {//定义@a字体颜色
  color: @a;
}

less不编译

#app {
  height: ~"calc(100vh - 40px)";
}

+ 合并以后，以逗号分割属性值

.mixin() {
  box-shadow+: inset 0 0 10px #555 ;
}
.myclass {
  .mixin();
  box-shadow+: 0 0 20px black;
}

+_ 合并以后，以空格分割属性值

.a(){
  background+:#f60;
  background+_:url("/sss.jod") ;
  background+:no-repeat;
  background+_:center;
}
.myclass {
  .a()
}
//background+_:#f60 url("/sss.jod");