安装less以及初步学习

1. Less （Leaner Style Sheets 的缩写） 是一门向后兼容的 CSS 扩展语言。

2. Less 提供了使用嵌套（nesting）代替层叠或与层叠结合使用的能力。
   *代码：header { color: black; }
   #header .navigation { font-size: 12px; }
   #header .logo { width: 300px; }
   用 Less 语言我们可以这样书写代码：

   #header { color: black; .navigation {
   font-size: 12px; } .logo {
   width: 300px; } }*

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

   .bordered {
   border-top: dotted 1px black;
   border-bottom: solid 2px black;
   }
   #menu a {
   color: #111;
   .bordered();
   }

   .post a {
   color: red;
   .bordered();
   }

4. 嵌套（Nesting）
   Less 提供了使用嵌套（nesting）代替层叠或与层叠结合使用的能力。假设我们有以下 CSS 代码：

   #header {
   color: black;
   }
   #header .navigation {
   font-size: 12px;
   }
   #header .logo {
   width: 300px;
   }
   用 Less 语言我们可以这样书写代码：

   #header {
   color: black;
   .navigation {
   font-size: 12px;
   }
   .logo {
   width: 300px;
   }
   }
   用 Less 书写的代码更加简洁，并且模仿了 HTML 的组织结构。

   你还可以使用此方法将伪选择器（pseudo-selectors）与混合（mixins）一同使用。下面是一个经典的 clearfix 技巧，重写为一个混合（mixin） (&表示当前选择器的父级）：

   .clearfix {
   display: block;
   zoom: 1;

   &:after {
   content: " ";
   display: block;
   font-size: 0;
   height: 0;
   clear: both;
   visibility: hidden;
   }
   }

5. @规则嵌套和冒泡
   @ 规则（例如 @media 或 @supports）可以与选择器以相同的方式进行嵌套。@ 规则会被放在前面，同一规则集中的其它元素的相对顺序保持不变。这叫做冒泡（bubbling）。

   .component {
   width: 300px;
   @media (min-width: 768px) {
   width: 600px;
   @media (min-resolution: 192dpi) {
   background-image: url(/img/retina2x.png);
   }
   }
   @media (min-width: 1280px) {
   width: 800px;
   }
   }

   编译为：

   .component {
   width: 300px;
   }
   @media (min-width: 768px) {
   .component {
   width: 600px;
   }
   }
   @media (min-width: 768px) and (min-resolution: 192dpi) {
   .component {
   background-image: url(/img/retina2x.png);
   }
   }
   @media (min-width: 1280px) {
   .component {
   width: 800px;
   }
   }

6. 安装
   用NPM

   npm install less -g
   这个-g选项安装lessc命令可在全球范围内使用。对于特定版本(或标记)，可以添加@VERSION在我们的包裹名称之后。npm install less@2.7.1 -g.

   节点开发安装
   或者，如果不想在全局使用编译器，则可能在

   npm i less --save-dev