认识Less、Less的语法

目录

一、初识Less

二、Less的语法

1.注释

2.变量

3.父元素

4.扩展

5.混合函数

6.less中的运算

7.引入less文件

---

一、初识Less

        less是一门CSS预处理语言

        less是一个CSS的增强版，通过less可以编写更少的代码实现更强大的样式

        在less中添加了许多新的特性，像对变量的支持、对mixin的支持...

        less的语法大体上和css一致，但是less中添加了许多对css的扩展， 所以浏览器无法直接执行less代码，要执行必须先将less转换为css，然后由浏览器执行

二、Less的语法

1.注释

Less中的注释以 // 开头，是单行注释

//less中的单行注释，注释中的内容不会被解析到css中

2.变量

变量，在变量中可以存储一个任意的值，并且我们可以在需要时，任意的修改变量中的值

        变量的语法：@变量名

 

 作为变量名时，如果是直接使用，则以 @变量名 的形式使用即可

.box4{
    width: @a;
    height: @a;
    background-color: @b;
}

作为类名，或者一部分值使用时必须以 @{变量名} 的形式使用