一、Less:
LESS 包含一套自定义的语法及一个解析器，用户根据这些语法定义自己的样式规则，这些规则最终会通过解析器，编译生成对应的 CSS 文件，其中会用到专门的编译器。
语法：文件后缀名是less。
1、定义变量
@name :属性的值//css中定义的变量。
作用域：less的变量和顺序无关，先是执行变量的申明。
加载的方式：按需加载（Lazy load）：运行的时候看值是多少。
混合：相当于是一种封装的效果
.wh(@w,@h){
width：@w;
height:@h;
}
嵌套 &：当前选择器
二：SCSS
后缀有sass和scss
sass为老版本的编译方式，没有局部变量
scss为新版本的编译方式，设置局部变量有作用
属性嵌套：
属性+冒号+{值}，例：
margin：{top：10px；left：20px；right:30px;bottom:40px;}
@at-root:跳出选择器
混合
参数之间不能用分号，申明必须在调用之前使用
@mixin wh($w,$h){
width：$w；
height：$h；
}
调用混合h2{@include wh;}
Compass
雪碧图
@import "icons/*.png";//导入图片并进行拼接
@include all-incons-sprites；
d2{width:;height:;@include icons-sprite(图片)}
三、bootstrap
栅格式布局，分为12格
container：宽度已经定义，可以自己定义高，container不能嵌套
row：必须放在container里面，可以嵌套row，而且必须写，代表行，宽度和container一样
col：（col-xs小于700的宽度，手机端/sm小屏幕，768到900多，平板/md中等屏幕，900-1200/lg超大屏幕1200以上的宽度）
col-xs-push-n 往后退几格
col-xs-pull-n 往前拉几格
col-xs-offset-n 往后退多少格会影响下一个元素页面的布局
