原文

Difference Between SASS and SCSS

SASS（Syntactically Awesome Style Sheets）是一種由 Hampton Catlin 設(shè)計、Chris Eppstein 和 Natalie Weizenbaum 開發(fā)的樣式表語言。 它是一種預(yù)處理器腳本語言，將被編譯或解釋為 CSS。 Sass Script 本身就是一種腳本語言。 它的 typing 規(guī)則是動態(tài)的。

SCSS 通常被稱為 Sassy CSS，它是作為 SASS（Syntactically Awesome Style Sheets）的主要語法引入的，它建立在現(xiàn)有的 CSS 語法之上。 它使用分號和括號，如 CSS（級聯(lián)樣式表）。 SCSS 是 CSS 的超集，即所有 CSS 功能都將在 SCSS 中可用，并且包含 SASS（Syntactically Awesome Style Sheets）的一些功能。 SCSS 使任何 CSS 術(shù)語都有效。

9 大區(qū)別：

區(qū)別1

SASS是Syntactically Awesome Style Sheets，是CSS的擴(kuò)展，提供嵌套規(guī)則、繼承、Mixins等特性，而SCSS是Sassy Cascaded Style Sheets，與CSS類似，填補(bǔ)了CSS與SASS之間的空白和不兼容。 它是在 MIT 許可下獲得許可的。它首次出現(xiàn)在2006年。

區(qū)別2

SASS 更易于使用且語法更簡單，因此無需使用分號、曲線、大括號等，而 SCSS 與 CSS 完全兼容，文件擴(kuò)展名為 .scss 類型。

區(qū)別3

SASS 具有最好的編碼標(biāo)準(zhǔn)和良好的官方文檔的特點，而 SCSS 更容易學(xué)習(xí)開發(fā)代碼。

區(qū)別4

SASS 基于 javascript 并支持不同的語言擴(kuò)展，擁有自己的語法、開源 CSS 預(yù)處理器和高級功能，例如控制和指令及其庫。

區(qū)別5

SASS 更難通過重寫代碼與現(xiàn)有 CSS 項目集成，而 SCSS 通過采樣添加新代碼而不是重寫現(xiàn)有代碼庫更容易與現(xiàn)有代碼庫集成。

區(qū)別6

SASS 更易于使用、閱讀和編寫，而 SCSS 在實現(xiàn)代碼方面更具邏輯性和復(fù)雜性。

區(qū)別7

SASS 變量將以美元 ($) 符號開頭，而 SCSS 具有模塊化功能，可以通過使用某種注釋以更加模塊化的方式組織代碼。

區(qū)別8

SASS 具有高級語法功能，并且其文件具有 .sass 擴(kuò)展名，而 SCSS 具有類似每個有效 CSS 文件都是 SCSS 文件的功能。

區(qū)別9

SASS 與 Ruby 相似，安裝需要使用 Ruby，沒有嚴(yán)格的代碼縮進(jìn)，而 SCSS 與 CSS 相似，無需任何額外安裝或配置即可輕松使用。

區(qū)別10

SASS 具有可在 CSS 文件的不同位置使用的局部和全局變量，而 SCSS 具有不同的變量，例如顏色變量，這些變量可以稍后在樣式表中使用。

區(qū)別11

SASS 具有嵌套功能，可以將 CSS 選擇器嵌套顯示在 HTML 中，并且難以維護(hù)較長的分層嵌套 CSS，而 SCSS 可以處理多個類和不同的嵌套樣式。

區(qū)別12

SASS 具有文檔樣式，它比 CSS 更好，并且具有顏色、屬性和參數(shù)列表的操作功能，而 SCSS 語法具有邊距、列表樣式、填充、顯示等。

區(qū)別13

SASS 具有控制指令、功能指令、Mixins 并具有可擴(kuò)展的特性，而 SCSS 可以與 SASS 一起使用來表示 CSS 類似的特性。

區(qū)別14

在最初的開發(fā)之后，SASS 擴(kuò)展到 SassScript。 它支持跨平臺操作系統(tǒng)。 它受到CSS、LESS、YAML等的影響。這個SASS的文件擴(kuò)展名是.scss和.sass，它的官方實現(xiàn)也是一個使用Ruby開發(fā)的開源項目。

結(jié)論

SASS 與 SCSS 都是 CSS 預(yù)處理器，它們非常有用，可包含在基于 CSS 的 UI（用戶界面）或前端框架中以簡化開發(fā)。 這些 SASS 與 SCSS 框架在以編程方式利用強(qiáng)大的 CSS 功能時在高級別的 CSS 功能方面提供了強(qiáng)大的功能。 SASS 是一種 CSS 擴(kuò)展，其中大部分功能都將被擴(kuò)展，而 SCSS 是 CSS 的一種超集，其中 CSS 的所有功能都將在 SCSS 中。 預(yù)處理器的選擇取決于通過以有效的方式做出權(quán)衡選擇來使應(yīng)用程序高效工作所需的功能和特性。

與SCSS相比，SASS更易于使用并且需要更少的語法或配置，推薦用于需要更快開發(fā)范圍和更容易開發(fā)復(fù)雜組件的較大應(yīng)用程序的情況，而SCSS可以用于優(yōu)化Mixin特性的情況，以及許多其他有效技術(shù)。

總結(jié)

以上是生活随笔為你收集整理的SASS 和 SCSS 的区别的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。