通俗的来讲，Less 是一个Css 预编译器,意思指的是它可以扩展Css语言,添加功能如允许变量(variables),混合(mixins),函数(functions) 和许多其他的技术，从而可以让Css更具维护性，主题性，扩展性。
本文为Less入门与语法梳理教程。其中包括了一些入门级例子，适合于对Less有入门级了解的开发者查阅。
LESS 源文件的引入方式与标准CSS文件的引入方式一样：
在我们需要引入 LESS 源文件的 HTML 中加入如下代码：
导入文件：
变量与作用域
}</p>
<p>/*用变量管理选择器名称、URLs、属性*/
@mySelector: banner; // 定义一个变量用于选择器名称
@images: "../img"; // 变量可以是字符串
@property: color; // 定义一个变量用于属性名称
.@{mySelector} { //选择器名称使用变量的用法
background: url("@{images}/white-sand.png"); //URLs使用变量的用法
@{property}: #0ee;
…… //其它常规属性等
}</p>
<p>/*编译生成的CSS文件*/
.banner {
background: url("../img/white-sand.png");
color: #0ee;
……
}
变量可以嵌套定义与使用
数值，颜色和变量可运算
混合（Mixins）与函数
}</p>
<p> // 在另外的样式选择器中使用
#header {
.roundedCorners; //使用类并且参数为默认值
}</p>
<p> #footer {
.roundedCorners(10px); //自定义参数值
}</p>
<p>.bordered {
border-top: dotted 1px black;
border-bottom: solid 2px black;
}</p>
<p>#menu a {
color: #111;
.bordered;
/*在另一个规则集内部使用上面类的属性，则直接访问属性所在类名（或Id名）即可*/
}
@arguments变量：当 Mixins 引用这个参数时，该参数表示所有的变量（多参数）。
命名空间：
嵌套规则：
Extend：
extend是一个Less伪类，为扩展选择器；扩展选择器必须在所有伪类的最后
}</p>
<p>/*编译生成的CSS文件*/
nav ul { // 声明块保持原样
background: blue;
}</p>
<p>.inline,nav ul {
color: red;
}</p>
<p>pre:hover , .some-class {
&:extend(div pre);
}</p>
<p>/*以上与给每个选择器添加一个extend完全相同*/
pre:hover:extend(div pre),
.some-class:extend(div pre) {}
从本质上讲extend会查找编译后的CSS，而不是原始的less
tr .bucket ,