less css预处理语言

安装
npm i -g less

使用
vscode安装插件easy less
新建一个less文件
例如:test.less
每次保存的时候，都会自动编译一个css文件 然后页面引入编译后的css文件即可 。

@声明变量

注:声明变量不能有特殊字符 .不能数字开头,可以数字结尾.区分大小写
例如: @colorp:purple;

嵌套
例如:

.father{
		.son{
			background-color:@colorp;
		}
}

ps：如果有伪类，交集，伪元素选择器，我们内层选择器的前面要加&
例如:

a{
	&:hover{
			color:pink
	}
}

编译后:

a:hover{
		color:pink
}

less注释是 //

less运算 + - * /
例如:

@num:10px + 5
div{
	width:@num * 2rem;
	height:@num / 2rem;
	border:@num solid black;
}
ps:运算符左右两边需要空格隔开
两个数参与运算，如果只有一个数有单位，那么结果就以该单位。
如果两个参数都有单位，那么结果就以第一个参数的单位为准。