我们先说下less吧，less就是一个变异版本的CSS，但是less却给我们编写css减少了很多麻烦，通过手写less，编译成css是非常方便的。
如果你习惯使用的开发工具是Dreamweaver，那么建议你直接使用国人开发的koala less编译工具进行编译。如果你习惯使用webstrom和sublime工具，就可以使用node.js进行配置相关的less编译环境。下面主要说webstrom下的less编译环境的配置。
首先，你得安装node.js安装好了以后，直接在命令行运行以下命令
npm install less -g
即可安装less编译环境。
下面就是配置webstrom了。
点击file->setting->tools->file watchers，然后点击右边的“+”号，进行添加less，如图：
弹出如下图所示，webstrom会自动寻找到less环境安装的目录，因此只需要点击OK即可完成配置。
赶快创建一个less文件来测试下，是否编译成功，创建文件代码如下：
@w:300px;
@h:200px;
@c:#F2F2F2;
@bg:red;
.main{
width: @w;
height:@h;
background: @bg;
&:hover{
color: @c;
}
}
会自动编译成一个css文件，其内容为：
.main {
width: 300px;
height: 200px;
background: red;
}
.main:hover {
color: #F2F2F2;
}
是不是很简单？，实例代码如下图所示：
