Sass and Less在什么情境下使用，两者有什么区别

2021-04-13 16:53发布

5条回答

2021-04-14 09:47

它们是什么？

它们是 CSS 预处理器。它是 CSS 上的一种抽象层。它们是一种特殊的语法/语言编译成 CSS。

例如 Less 是一种动态样式语言. 将 CSS 赋予了动态语言的特性，如变量，继承，运算，函数. Less 既可以在客户端上运行 (支持 IE 6+, Webkit, Firefox)，也可以在服务端运行 (借助 Node.js)。

有什么区别？

1、关于变量在Less和Sass中的唯一区别就是Less用@，Sass用$

2、Less环境较Sass简单：Sass的安装需要安装Ruby环境，Less基于JavaScript，是需要引入Less.js来处理代码输出css到浏览器，也可以在开发环节使用Less，然后编译成css文件，直接放在项目中。

3、从功能出发，Sass较Less略强大一些

①sass有变量和作用域。

$variable，like php；

#｛$variable｝like ruby；

变量有全局和局部之分，并且有优先级。

②sass有函数的概念；

@function和@return以及函数参数（还有不定参）可以让你像js开发那样封装你想要的逻辑。

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

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

③进程控制：

-条件：@if @else；

-循环遍历：@for @each @while

-继承：@extend

-引用：@import

④数据结构：

-l i s t 类型 = 数组； − list类型=数组； -list类型=数组；−map类型=object；

其余的也有string、number、function等类型