前言
css是标记语言，无法定义变量、进行计算等，常常会有不同元素定义同样样式的地方，造成很多冗余代码，而less、scss等正是改变了这一缺点，使css变得‘有逻辑’。
一、Less基本介绍
less是一门css扩展语言、css预处理语言，他可以编写样式的同时使用变量、进行计算，减少冗余代码，提高开发效率
二、安装、编译
下载 npm install less -g
查看less版本 lessc -v
此时电脑中安装好less，可以使用less编写样式了。
编写完成后需要编译后才可以供浏览器使用，
vscode中有插件easy-less，下载安装并重启vscode，
此时，编写less代码，保存后会自动生成less文件同名的css文件，
将此css文件引入即可。
三、Less定义变量
定义变量基本格式为:
@变量名：变量值
使用的时候可以直接当成变量去使用
如：
@fontSize:14px; div{ font-size:@fontSize; }
四、Less嵌套
使用less做嵌套很简单，父子关系的元素样式直接嵌套，伪类、伪元素、并集交集选择器等使用&拼接
如：
.dv{
.left{
font-size:@fontSize;
a{
// left中的a样式
&:hover{
//left中的a 鼠标悬停时候的样式
}
}
}
.right{
....
}
}
五、Less运算
less中可以进行运算 直接使用数学运算符即可
div{
height:10px + 5;
}
如果进行运算的两个值只有一个有单位，则以此为准，如果都有单位，则以前者单位为准
Less混入
less中使用 @import ' '引入别的less文件 编译后的css文件即为两文件的结合
如：
common.less:
@bgColor:pink;
body{
background-color:@bgColor;
}
index.less:
@import './common.less'
......
index.css:
body:{
background-color:pink;
}
..........
