原文網址：less，sass，scss的關系與區別_IT利刃出鞘的博客-CSDN博客

簡介

        本文介紹less，sass，scss的關系與區別。

相同點

簡述

    less、sass、scss，它們都是為了使CSS開發更方便而產生的，都可以稱為：動態樣式語言。

    原先我們是用原生CSS來寫樣式，但它不方便，比如：不支持嵌套、運算、作用域 等。

    使用less、sass或scss寫樣式很方便，最終它們會被處理為原生的CSS來處理樣式。

less和scss在語法上的相同點

1. 混入(Mixins)
   1. class中的class；
2. 參數混入
   1. 可以傳遞參數的class，就像函數一樣；
3. 嵌套規則
   1. Class中嵌套class，從而減少重復的代碼；
4. 運算
   1. CSS中用上數學；
5. 顏色功能
   1. 可以編輯顏色；
6. 名字空間(namespace)
   1. 分組樣式，從而可以被調用；
7. 作用域
   1. 局部修改樣式；
8. JavaScript 賦值
   1. 在CSS中使用JavaScript表達式賦值。

sass和scss的區別

        Scss(sassy css)是Sass（(Syntactically Awesome Stylesheets)的改良版本。

        Sass的語法是：使用縮進。這對于寫慣css的開發者來說很不直觀，也不能將css代碼加入到Sass里面。因此sass語法進行了改良，Sass 3就變成了Scss(sassy css)，與原來的語法兼容，只是用{}取代了原來的縮進。

less與sass的區別

見：less與sass(scss)的區別

選擇less還是sass？

建議：sass。

1. Sass有更成熟的框架，比如說Compass
2. 很多框架也使用Sass，比如：
   1. bootstrap（Web框架）最新推出的版本4，使用的是Sass
   2. vue-element-admin；
   3. Foundation；
3. 就國外討論的熱度來說，Sass絕對優于less；