Less 介绍

1 什么是 Less

Less 是一种动态样式语言，属于 CSS 预处理器的范畴，它扩展了 CSS 语言，增加了变量、Mixin、函数等特性，使 CSS 更易维护和扩展

因为 Less 和 CSS 非常像，学习很容易。而且 Less 仅对 CSS 语言增加了少许方便的扩展，这就是 Less 如此易学的原因之一。

Less (Less编辑器 ) 是开源的，其第一个版本由 Ruby 写成，但在后续的版本当中，Ruby 逐渐被替换为 JavaScript。受益于JavaScript，LESS可以在客户端上运行（IE6+、Webkit、Firefox），也可以在服务端运行（Node.js 、Rhino）。

2 Less 编译工具

2.1 less.js

<!doctype html>
<html lang="cn-ZH">
    <head>
        <meta charset="utf-8"></meta>
        <title>LESS</title>
        <!-- 直接在 style 标签内写 less 代码-->
        <style type="text/less">
            ...
        </style>

        <!--也可以单独引入 less 文件-->
        <link rel="stylesheet/less" type="text/css" href="styles.less">

        <!--less.js 可以将上面的 less 编译为 css-->
        <script src="https://cdn.bootcss.com/less.js/3.9.0/less.js"></script>
    </head>
    <body></body>
</html>

2.2 命令行安装 less

此方式需要 node 的支持

安装

npm install less -g

使用

lessc bootstrap.less bootstrap.css

2.3 第三方编译工具 koala（考拉）

koala 官网: http://koala-app.com/index-zh.html

Less介绍