Less 是一门 CSS 预处理语言,它扩展了 CSS 语言,增加了变量、Mixin、函数等特性,使 CSS 更易维护和扩展

Less 可以运行在 Node 或浏览器端

使用less

安装less的编译器

在命令行中执行

  1. cnpm install -g less

验证输入

  1. lessc

使用方法

我们先写成一种格式,然后再通过less编译器转换成css代码

转换步骤

  • 进入要转换的less文件所在文件夹
  • 直接在资源管理器点击地址栏,输入CMD
  • 运行lessc就可以将其转化成css
    1. lessc style.less style.css
    lessc 要转换的文件名字 要生成的文件名字

实时less编译

1、打开环境变量窗口并查看path环境变量
2、在环境变量中找到包含npm的路径

webstorm中,每次对less编译后都会自动生成一个xxx.css.map文件
该文件的作用就是,将css和less文件进行管理,使我们可以直接对less文件进行调试

在网页中对less文件进行编译

需要使用script标签引入less.min.js

  1. <link rel="stylesheet/less" href="css/style/less">
  2. <script src="script/less.min.js"></script>