less学习

一.变量

1
2
3
4
5
--color:#bfa; //定义
var(--color) //使用
calc()计算函数
@import "./index.css";
上面为css支持的

二.入门

1
2
3
4
5
6
7
8
@变量名:xxx; //定义
@变量名 //使用

可以嵌套选择器 子代用> &表示外层的父级元素

作为类名或者一部分值使用需要@{}

$color 可以去属性对应的值

三.进阶

1
2
3
4
5
6
7
8
9
继承: .p2.extend(.p1)

.p1() 直接引用p1的样式

函数
使用类选择器可以加个()创建了一个类似于函数(mixins) 直接使用.p1使用

.p1(@w)
可以传送参数

四.内置函数

1
2
3
darken(#bfa,10%) 比传入的颜色深一定比例