2)安裝haml sass
開啟ruby的命令符面板，輸入： gem install haml 和 gem install sass
3)進入相應的檔案中,執行命令
sass test.scss test.css
sass --style compressed|nested|compact|expanded test.scss test.css
* nested：巢狀縮排的css**，它是預設值。
* expanded：沒有縮排的、擴充套件的css**。
* compact：簡潔格式的css**。
* compressed：壓縮後的css**。
監聽某個檔案
sass --watch input.scss:output.css
監聽目錄
1）預設
$color:red !detault;
2)全域性、區域性
$color:red !global;
3)巢狀 &表示父元素選擇器
(1)無引數
@mixin border-radius
button
(2)有引數
@mixin border-radius($w:3px)
div(3)多個引數
@mixin boxsize($w:100px,$h:200px)
.box
(1)@extend
eg:.error
.one
.second .error
(1)% 佔位符
(1)+ - * / %
(2)p
(1)p@else
}(2)三目運算子
$isbold:true;
p(3)for迴圈
@for $i from 1 through 3
}@for $i from 1 to 3
}注意：through 包含end,to不包含end
(4)each迴圈
(5)while迴圈
$i:6;
@while $i>0
$i:$i - 2; //-左右得有空格
}
Sass學習筆記
安裝 2.開啟ruby的命令視窗 start command prompt with ruby 輸入gem install sass gem install sass pre 要安裝beta版本的 gem update sass 公升級sass vsass hgit安裝 git clone git ...
Sass學習筆記
1.全域性變數p background color color red span div2.default 第二種，使用前面定義的值 color red 變數申明帶有 default，但是前面還有這個變數的申明 color blue default p3.變數用 包裹 btnclass btn de...
Sass學習筆記。
定義 css預處理器定義了一種新的語言，其基本思想是，用一種專門的程式語言，為css增加了一些程式設計的特性，將css作為目標生成檔案，然後開發者就只要使用這種語言進行編碼工作。採用ruby語言編寫的一款css預處理語言 副檔名 sass 嚴格的縮排式語法 scss 與平時css語法書寫類似 scs...