sass、scss、和css的關系

發(fā)布時間：2020-07-07 13:28:47 來源：網絡閱讀：8991 作者：小佳怡欄目：web開發(fā)

說到css，相信大家都知道，css樣式是用來修飾網頁頁面結構的。那么sass、scss又是做什么的呢？接下來我們來一起了解一下。

要了解css、sacc和scss的關系就要從css預處理器開始說起。

什么是css預處理器？css預處理器是用一種專門的語言，進行網頁的樣式設計，之后在被編譯為正常的css文件，以供項目使用。

使用css預處理語言的好處：是css更加簡潔、方便修改、可讀性強、適應新強并且更易于代碼的維護。

sass是由buby語言編寫的一款css預處理語言，和html一樣有嚴格的縮進風格，和css編寫規(guī)范有著很大的出入，是不使用花括號和分號的，所以不被廣為接受。

sass和scss其實是一樣的css預處理語言，其后綴名是分別為 .sass和.scss兩種。

SASS版本3.0之前的后綴名為.sass，而版本3.0之后的后綴名.scss。

兩者是有不同的，繼sass之后scss的編寫規(guī)范基本和css一致，sass時代是有嚴格的縮進規(guī)范并且沒有‘{}’和‘；’。而scss則和css的規(guī)范是一致的。

示例代碼:

sass

#sidebar
  width: 30%
  background-color: #faa

scss

#sidebar {
  width: 30%;
  background-color: #faa;
}

SCSS 和 CSS 寫法無差別：

SCSS 和 CSS 寫法無差別，這也是 Sass 后來越來越受大眾喜歡原因之一。簡單點說，把你現(xiàn)有的“.css”文件直接修改成“.scss”即可使用。

向AI問一下細節(jié)

sass、scss、和css的關系