携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第18天，点击查看活动详情
Scss
- Scss其实是Sass的改进版本
Scss是Sass的缩排语法，对于写惯css前端的web开发者来说很不直观，也不能将css代码加入到Sass里面，因此Sass语法进行了改良，Sass 3就变成了Scss(sassy css)。与原来的语法兼容，只是用{}取代了原来的缩进。
Less
- Less环境较Sass简单
Sass的安装需要安装Ruby环境，Less基于JavaScript，需要引入Less.js来处理代码输出css
Scss与Less的区别
- 变量符不一样，Less是@，而Sass是$，而且变量的作用域也不一样。
Sass没有局部变量，满足就近原则。Less中{}内定义的变量为局部变量。
- Less没有输出设置，Sass提供4中输出选项
输出样式的风格可以有四种选择，默认为nested
nested：嵌套缩进的css代码
expanded：展开的多行css代码
compact：简洁格式的css代码
compressed：压缩后的css代码
- Sass支持条件语句，可以使用if{}else{},for{}循环等等。而Less不支持。
- Less与Sass处理机制不一样
Less是通过客户端处理的，Sass是通过服务端处理，相比较之下Less解析会比Sass慢一点
- Sass和Less的工具库不同
Sass有工具库Compass, 简单说，Sass和Compass的关系有点像Javascript和jQuery的关系,Compass是Sass的工具库。在 它的基础上，封装了一系列有用的模块和模板，补充强化了Sass的功能。
Less有UI组件库Bootstrap, Bootstrap是web前端开发中一个比较有名的前端UI组件库，Bootstrap的样式文件部分源码就是采用Less语法编写，不过Bootstrap4也开始用Sass编写了。
最后
个人学习笔记，仅供参考！
