less

---

less

• less是一门css的预处理语言
  • less 是一个css的增强版，通过less可以编写更少的代码实现更强大的样式
  • 在less中添加了许多的新特性：像对变量的支持、对mixin的支持…
  • less的语法大体上和css语法一致，但less中增添了许多对css的扩展，所以浏览器无法直接执行less代码，要执行必须先将less转换为css，然后再由浏览器执行
• // less中的单行注释，注释内容不会被解析到css中
• /* */ css中的注释，内容会被解析到css文件中

less中的变量

• 在变量中可以存储一个任意的值，并且我们可以再需要时，任意修改变量中的值
• 变量的语法： @变量名
  • 使用变量时，如果是直接使用则以@变量名的形式使用即可
  • 若作为类名，或者一部分值使用时必须以@{变量名}的形式使用
  • 变量发生重名时，会优先使用比较近的变量
  • &就表示外层的父元素
  • :extend() 对当前选择器扩展指定选择器的样式（选择器分组）
  • mixin 混合 //直接对指定的样式进行引用，相当于复制
  • mixins 混合函数 //在使用类选择器时在选择器后边添加一个括号
    • 在混合函数中可以直接设置变量 // .test(@w,@h)引用时传参数
• 在less中所有的数值都可以直接进行运算
• @import ""; 引入less文件 （ 可进行模块化处理）

---

---

css原生也支持变量的设置

html{
            /* css原生也支持变量的设置 */
            --x: #bfa;
            --y: 200px;
        }

calc()计算函数