从我所读到的内容来看,Sass是一种通过变量和数学支持使CSS更强大的语言。

SCSS有什么不同?应该是同一种语言吗?相像的不同的


当前回答

Sass是一个具有语法改进的CSS预处理器。高级语法中的样式表由程序处理,并转换为常规CSS样式表。然而,它们并没有扩展CSS标准本身。

CSS变量是受支持的,可以使用,但不能像预处理器变量一样使用。

对于SCSS和Sass之间的区别,Sass文档页面上的文本应回答以下问题:

SCSS语法使用文件扩展名.scs。除了一些小的例外,它是CSS的超集,这意味着基本上所有有效的CSS都是有效的SCSS。由于它与CSS相似,所以它是最容易使用和最流行的语法。

缩进的语法是Sass的原始语法,因此它使用了文件扩展名.Sass。由于这个扩展名,它有时被称为“Sass”。缩进语法支持与SCSS相同的所有功能,但它使用缩进而不是大括号和分号来描述文档的格式。

然而,所有这些都只适用于Sass预编译器,后者最终会创建CSS。它不是CSS标准本身的扩展。

其他回答

Sass是第一个,语法有点不同。例如,包括mixin:

Sass: +mixinname()
Scss: @include mixinname()

Sass忽略了大括号和分号,而专注于嵌套,我发现这更有用。

我是帮助创建Sass的开发人员之一。

区别在于语法。在文本外部之下,它们是相同的。这就是sass和scs文件可以相互导入的原因。实际上,Sass有四个语法解析器:scs、Sass、CSS等等。所有这些都将不同的语法转换为抽象语法树,然后通过sass转换工具将其进一步处理为CSS输出,甚至转换为其他格式之一。

使用您最喜欢的语法,这两种语法都是完全支持的,如果您改变主意,您可以稍后在它们之间进行更改。

我发现自己也在想同样的事情,在哈佛大学的CS50中偶然发现了一个直截了当的解释:

一种叫做Sass的语言。。。(是)本质上是CSS的扩展。。。它为CSS添加了附加功能。。。只是为了让它更强大一点供我们使用。

Sass的一个关键特性是能够使用变量

Sass扩展名为.scs(与普通css文件的.css不同)。

因此,当我们问“scs和sass之间有什么区别?”时,答案很简单,.scs只是希望使用sass而不是常规CSS时使用的文件扩展名。

紧凑的答案:

SCSS是指Sass CSS预处理器支持的主要语法。

以.scs结尾的文件表示Sass支持的标准语法。SCSS是CSS的超集。以.sass结尾的文件表示源于Ruby世界的sass支持的“旧”语法。

TL;博士

两者都是Sass,但不同的只是编译选项。

S(组件)CSS=Sass

您可以使用SASS的语法不仅有一种,还有两种:一方面,您具有原始形式,这很高兴被称为“缩进语法”或简称为“SASS”。此外,还有一个更新的变体,它更接近于CSS的规范,因此被称为Sassy CSS(SCSS),即SASS风格的CSS。在SASS第3版中,SCSS已被确立为官方语法。最大的区别是使用了括号和分号。

原始SASS语法使用缩进和换行符,这是一种基于YAML的方法。要终止一行代码,只需换行即可,即按Enter键。缩进非常简单地通过制表器工作。因此,通过改变字体的位置,就形成了分组——所谓的声明块。这对于CSS本身是不可能的。这里,大括号必须用于分组,分号必须用于属性声明。这正是SCSS所需要的。

因此,SASS与SCSS之间存在争议

一些用户对原始SASS的易用性信誓旦旦,因为在移动源代码片段时,您不必注意括号的正确位置,通常会生成更精简、更简洁的代码。总的来说,“缩进语法”使用更少的字符和行。另一方面,SCSS的支持者很乐意接受额外的努力,因为无论如何,它与CSS所知的更为相似。

SCSS是CSS的超集,这确保了CSS代码基本上也可以在SCSS中工作,但不是相反。尽管如此,SASS的功能仍被完全包括在内。这使得同时使用两种语言更加容易。此外,对于已经使用CSS并且已经习惯语法的人来说,切换要容易得多。尽管SASS支持这两种语法,但您必须根据项目进行选择:为了能够区分不同的格式,您可以将文件扩展名为.SASS或.scs。