less，sass，scss的关系与区别

less，sass，scss的关系与区别

简介

本文介绍less，sass，scss的关系与区别。

相同点

简述

less、sass、scss，它们都是为了使CSS开发更方便而产生的，都可以称为：动态样式语言。也可以称为：CSS预编译语言。

原先我们是用原生CSS来写样式，但它不方便，比如：不支持嵌套、运算、作用域 等。

使用less、sass或scss写样式很方便，它们都支持嵌套、运算、作用域 等，最终它们会被处理为原生的CSS来处理样式。

less和scss在语法上的相同点

混入(Mixins)

class中的class；

参数混入

可以传递参数的class，就像函数一样；

嵌套规则

Class中嵌套class，从而减少重复的代码；

运算

CSS中用上数学；

颜色功能

可以编辑颜色；

名字空间(namespace)

分组样式，从而可以被调用；

作用域

局部修改样式；

JavaScript 赋值

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

sass和scss的区别

Scss(sassy css)是Sass（(Syntactically Awesome Stylesheets)的改良版本。

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

less与sass的区别

见：less与sass(scss)的区别_IT利刃出鞘的博客

选择less还是sass？

建议：sass。

Sass有更成熟的框架，比如说Compass很多框架也使用Sass，比如：

bootstrap（Web框架）最新推出的版本4，使用的是Sassvue-element-admin；Foundation；

就国外讨论的热度来说，Sass绝对优于less；

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。