less基础教程

less基础教程：

写原生CSS，会让页面结构越来越混乱，几乎看不出层次结构。（less推荐写嵌套结构）

需要通过进行预编译，让嵌套的css转换成能让浏览器能够识别的样式，而没有误差。

引入less:（其实还有其它预处理器，不过功能都差不多sass和stylus等）

http://www.frontendjs.com/

前站  文档栏就有官网：

 

如果直接引入一个less代码，需要引入一个less预处理器：

<style type="text/less">

使用less编写的css代码；

</style>

通过引入less.js对less文件进行预编译（用less写的css代码嵌套结构）；

<script src="less/less-min.js"></script>

但是这个会耗费js性能，可以在编写的时候进行预编译，上线的话需要将less编写的通过编译成完整的css文件，再引入css，不直接使用less就能不耗费线上资源

上述的过程可以通过node来跑，也就是说其实可以在服务器端对less文件进行预编译。

编译不影响上线的运行时间（开发人员在开发时自己编译的）（提高开发效率，便于管理代码块）

less编译工具：