Less和Sass

Less和Sass都是CSS预处理器；CSS预处理器是一种专门的编程语言进行web页面样式设计再通过编译器转化为正常的CSS文件然后进行布局设计。

使用CSS预处理器的原因：

1.语法不够强大，无法嵌套书写，导致模块开发中需要书写很多重复的选择器；

2.没有变量和合理的样式复用机制，逻辑上相关的属性值必须以字面量的形式重复输出导致难以维护。

Less和Sass相同之处：

1.混入(Mixins)：class中的class；

2.参数混入：可以传递参数的class，就像函数一样；

3.嵌套规则：class中嵌套class，从而减少重复的代码；

4.运算：CSS中用上数学；

5.颜色功能：可以编辑颜色；

6.名字空间：分组样式，从而可以被调用；

7.作用域：局部修改样式；

8.JavaScript赋值：在CSS中使用JavaScript表达式赋值。

Less和Sass区别：

Less是基于JavaScript的，是在客户端处理；

Sass是基于Ruby的，是在服务器端处理的；

Less较Sass相比较而言简单，具有CSS原本的特性，在原有的CSS基础上，加上了程序式语言的特性；

Less和Sass唯一的区别就是Less用@，Sass用$；

从功能上看，Sass比Less较为强大：

1.Sass有变量和作用域：变量有全局与局部之分并且有优先级；

2.Sass有函数概念：@function和@return以及函数参数（还有不定参）可以让你像js开发那样封装你想要的逻辑；

@mixin类似function但缺少像function的编程逻辑，更多的是提高css代码段的复用性和模块化，这个用的人也是最多的；

ruby提供了非常丰富的内置原生api。

3.进程控制：条件：@if @else；

循环遍历：@for @each @while

继承：@extend

引用：@import

4.数据结构：$list类型=数组；

$map类型=object；