Less的使用方法

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

一、安装

在Node.js环境中使用Less：

//安装：
npm install -g less
> lessc styles.less styles.css

在浏览器环境中使用 Less ：

//在浏览器环境中使用 Less ：
 
<link rel="stylesheet/less" type="text/css" href="styles.less" />
<script src="//cdnjs.cloudflare.com/ajax/libs/less.js/3.11.1/less.min.js" ></script>

cmd中：

 
npm i less less-loader -D  //css预处理语言

二、 功能

1、变量

<style lang="less">
// 01 定义变量 
@gray:#999;
@size:20px;
.plusAction a{
  color:@gray;
  font-size:-10px+@size;
 }
</style> 

2、混合

混合（Mixin）是一种将一组属性从一个规则集包含（或混入）到另一个规则集的方法。假设我们定义了一个类（class）如下ÿ