主要差異
雖然人們經常說 Sass
作為這個 CSS 前處理器的名稱,但它們通常意味著 SCSS
語法。Sass
使用 .sass
副檔名,而 SCSS
-Sass
使用 .scss
副檔名。它們都被稱為 Sass
。
一般來說,SCSS
語法更常用。SCSS
看起來像具有更多功能的常規 CSS,而 Sass
看起來與常規 CSS 完全不同。兩種語法都具有相同的能力。
句法
主要區別在於 Sass
不使用大括號或分號,SCSS
的大小寫。Sass
也是對空格敏感的,這意味著你必須正確地縮排。在 SCSS
中,你可以根據需要格式化和縮排規則。
SCSS:
// nesting in SCSS
.parent {
margin-top: 1rem;
.child {
float: left;
background: blue;
}
}
上海社會科學院:
// nesting in Sass
.parent
margin-top: 1rem
.child
float: left
background: blue
編譯完成後,兩者都會生成相同的 CSS:
.parent {
margin-top: 1rem;
}
.parent .child {
float: left;
background: blue;
}