[Sass]聲明變量

定義變量的語法：

在有些編程語言中（如，JavaScript）聲明變量都是使用關鍵詞“var”開頭，但是在Sass不使用這個關鍵詞，而是使用大家都喜歡的美元符號“$”開頭。我想用一張圖來解釋，我一直堅信，一圖胜千言萬語：

上圖非常清楚告訴了大家，Sass 的變量包括三個部分：

1. 聲明變量的符號“$”
2. 變量名稱
3. 賦予變量的值

來看一個簡單的示例，假設你的按鈕顏色可以給其聲明幾個變量：

$brand-primary : darken(#428bca, 6.5%) !default; // #337ab7
$btn-primary-color : #fff !default;
$btn-primary-bg : 
$brand-primary !default;
$btn-primary -border : darken( 
$btn-primary-bg, 5%) !default;

如果值後面加上!default則表示默認值。

注：了解Bootstrap 的Sass 版本的同學，就一眼能看出，上面的示例代碼是Bootstrap 定義primarybutton 的顏色。