SASS和LESS都是專用於CSS的預編譯語言，他們2者的功能，操作都是大同小異。LESS稍微簡單一些，而SASS有一些比較成熟的框架（如compass），功能強大一些，其中的語法也比較符合一門程式語言的習慣，比如說函式，作用域，程序控制等等。所以，我也是選擇的SASS來使用。
一、SASS中文官網
使用：
建立一個SCSS字尾的檔案。
變數：
$name :       定義變數 
直接呼叫$name引用變數
巢狀的CSS規則：
匯入：@import
處理.SASS檔案和.SCSS檔案的相互轉換
sass和scss是SASS的兩種不同的語法，我們一般使用scss語法
註釋：
//      不會編譯進css檔案
/**/    會編譯進css檔案
混合器：
@mixin 
@include
編譯複雜混合屬性用（如：font，background）
繼承：
@extend
佔位選擇符：

#context a%extreme {
  color: blue;
  font-weight: bold;
  font-size: 2em;
}

.notice {
  @extend %extreme;
}

編譯為：

#context a.notice {
  color: blue;
  font-weight: bold;
  font-size: 2em; 
}

注：繼承最好不要繼承被包含的子選擇器，編譯出來後會把包含關係交叉寫的非常複雜，可讀性很差。
流程控制：
@if
@if - @else
@if - @else if - @else
@for $var from <start> through <end>     ---- 包括開始與結束
@for $var from <start> to <end>     ---- 包括開始，不包括結束
@each $var in <list>
@while condition {statements;}
函式：
@function fn(args) {
// statements
@return exp;
}

略

SASS和LESS都需要通過編譯後成為CSS檔案才能使用，編譯工具有很多種，下面推薦2種我常用的：

1、Koala

一款視覺化的前端前處理器語言圖形編譯工具，優點是操作比較簡便，可以批量操作，輕鬆設定各種引數。

2、gulp外掛

gulp外掛是非常多且功能強大的，其中不乏SASS和LESS的編譯工具。優點是不需要裝新的軟體，而且找起來很方便。缺點是需要自己手寫引數。