Sass 和 SCSS 其實(shí)是同一種東西,我們平時(shí)都稱(chēng)之為 Sass眨攘,兩者之間不同之處有以下兩點(diǎn):
1.文件擴(kuò)展名不同,Sass 是以“.sass”后綴為擴(kuò)展名,而 SCSS 是以“.scss”后綴為擴(kuò)展名
2.語(yǔ)法書(shū)寫(xiě)方式不同递惋,Sass 是以嚴(yán)格的縮進(jìn)式語(yǔ)法規(guī)則來(lái)書(shū)寫(xiě),不帶大括號(hào)({})和分號(hào)(;)溢陪,而 SCSS 的語(yǔ)法書(shū)寫(xiě)和我們的 CSS 語(yǔ)法書(shū)寫(xiě)方式非常類(lèi)似萍虽。
先來(lái)看一個(gè)示例:
Sass 語(yǔ)法
$font-stack: Helvetica, sans-serif //定義變量
$primary-color: #333 //定義變量
body
font: 100% $font-stack
color: $primary-color
SCSS 語(yǔ)法
$font-stack: Helvetica, sans-serif;
$primary-color: #333;
body {
font: 100% $font-stack;
color: $primary-color;
}
編譯出來(lái)的 CSS
body {
font: 100% Helvetica, sans-serif;
color: #333;
}