css预处理语言less的使用

1.首先定义变量是用@来表示：

@color:red;
h1{color:@color;}

2.嵌套

样式嵌套

ul{
   color:red;
   li{  line-height:48px;
      a{text_decoration:none
         &:{color:#f70;}
       }
   }
}

可以在不重复类名的情况再加样式省去了繁琐的样式写法还是挺有用的 

3 .运算

4.转义

用~表示转义

把类名和样式转义成字符串这样想用的时候直接用转义的变量

它分为自身用和别的样式用

自身用需要加个大括号

如图：

  

 5.引用与映射

6.作用域

@color:red;
.test{
    @color:blue;
     .block{color:@color}
}