Less与Sass的区别

---

前言

这里简单介绍一下less与sass的区别

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、两者是什么

Less：
是一种动态样式语言. 对CSS赋予了动态语言的特性，如变量、继承、运算、函数。
Sass：
是一种动态样式语言，Sass语法属于缩排语法，

二、两者关系

Sass的缩排语法，对于写惯css前端的web开发者来说很不直观，也不能将css代码加入到Sass里面，因此sass语法进行了改良，Sass 3就变成了Scss(sassy css)。与原来的语法兼容，只是用{}取代了原来的缩进。

三、两者区别

1.实现方式

Less和Sass的主要不同就是他们的实现方式。 Less是基于JavaScript，是在客户端处理的。 Sass是基于Ruby的，是在服务器端处理的

2.变量

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

3.输出设置

Less没有输出设置。
Sass提供4中输出选项：nested, compact,compressed和 expanded。

4.支持语句不同

Sass支持条件语句，可以使用if{}else{},for{}循环等等。
Less不支持。

5.引用外部css文件

Scss引用的外部文件命名必须以_开头, 如下例所示:其中_test1.scss、_test2.scss、_test3.scss文件分别设置的h1 h2 h3。文件名如果以下划线_开头的话，Sass会认为该文件是一个引用文件，不会将其编译为css文件.
Less引用外部文件和css中的@import没什么差异。

6.工具库不同

Sass有工具库Compass, 简单说，Sass和Compass的关系有点像Javascript和jQuery的关系,Compass是Sass的工具库。在它的基础上，封装了一系列有用的模块和模板，补充强化了Sass的功能。
Less有UI组件库Bootstrap,Bootstrap是web前端开发中一个比较有名的前端UI组件库，Bootstrap的样式文件部分源码就是采用Less语法编写。。

总结

以上就是今天要讲的内容