SASS - 函數

---

• SASS – 簡介
• SASS – 環境搭建
• SASS – 使用Sass程序
• SASS – 語法
• SASS – 變量
• SASS- 局部文件(Partial)
• SASS – 混合(Mixin)
• SASS – @extend（繼承）指令
• SASS – 操做符
• SASS – 函數
• SASS – 輸出格式

---

本文介紹Sass函數。Sass包含大量函數，本文介紹最重要最經常使用的函數，其餘能夠參考官方文檔。

顏色函數

sass包含不少操做顏色的函數。例如：lighten() 與 darken()函數可用於調亮或調暗顏色，opacify()函數使顏色透明度減小，transparent()函數使顏色透明度增長，mix()函數可用來混合兩種顏色。

下面是mix()函數例子:

div {
    padding: 20px;
    margin: 20px;
}
.one {
    background: red;
    }
.two {
    background: yellow;
}
.three {
    background: mix(red, yellow);
    }
.four {
    background: mix(red, yellow, 35%);
}
.five {
    background: mix(red, yellow, 65%);
}

通過編譯輸出如下CSS代碼：

div {
  padding: 20px;
  margin: 20px; }

.one {
  background: red; }

.two {
  background: yellow; }

.three {
  background: #ff8000; }

.four {
  background: #ffa600; }

.five {
  background: #ff5900; }

語法是mix($color1， $color2， [$weight])，可選的$weight參數設置$color1的權重，若是省略，則權重爲50%。

字符串函數

Sass有許多處理字符串的函數，好比向字符串添加引號的quote()、獲取字符串長度的string-length()和將內容插入字符串給定位置的string-insert()。

數值函數

數值函數處理數值計算，例如：percentage()將無單元的數值轉換爲百分比，round()將數字四捨五入爲最接近的整數，min()和max()獲取幾個數字中的最小值或最大值，random()返回一個隨機數。

List 函數

List函數操做List，length()返回列表長度，nth()返回列表中的特定項，join()將兩個列表鏈接在一塊兒，append()在列表末尾添加一個值。

Map 函數

Map函數操做Map，map-get()根據鍵值獲取map中的對應值，map-merge()來將兩個map合併成一個新的map，map-values()映射中的全部值。

選擇符函數

選擇符相關函數，例如：selector-append()能夠把一個選擇符附加到另外一個選擇符。

自檢函數

自檢相關函數，例如：feature-exists()檢查當前Sass版本是否存在某個特性，variable-exists()檢查當前做用域中是否存在某個變量，mixin-exists()檢查某個mixin是否存在。

Sass函數的完整列表

還有許多其餘函數，詳情請參閱Sass文檔。