這段時間一直在看Bootstrap，V3官方直接提供了Less版本的源碼，就先將Less學完了，很簡單的語法，學習寫Demo都是在Webstorm里寫的，配置了Watcher自動編譯（詳見《在WebStorm里配置watcher實現編輯less文件時自動生成.map和壓縮后的.CSS文件》）。 隨著學習的加深，開始接觸Sass了，Bootstrap V3也提供了Sass的源碼，而且V4官方就只提供Sass的源碼，從側面證明Sass的流行趨勢，畢竟Sass功能更全面，因此筆者決定以后就使用Sass了（新版本叫Scss）。
1、下載rubyinstaller-2.3.3-x64.exe 安裝（從官網下載，或者從這里鏈接：http://pan.baidu.com/s/1o7BxbR0 密碼：rctf），注意，安裝過程中下面的設置。 
2、安裝完成后用命令檢查是否安裝成功，成功會顯示版本信息。
3、安裝Sass
安裝完后，C:/Ruby23-x64/bin里將有下面的文件。 
4、Webstorm里添加Watcher 同Less類似，在工程里新建scss文件時會自動顯示【Add Wather】,如果沒有提示，也可以通過【文件(File)】-【設置(Settings)】-【工具(Tools)】-【File Watchers】-【+】-【SCSS】打開New Watcher配置界面。 
默認值(默認生成css 和 css.map)
| 參數名 | 參數值(下面no和update前是兩個”-“) |
|---|---|
| PRogram | C:/Ruby23-x64/bin/scss.bat |
| Arguments | –no-cache –update $FileName$:$FileNameWithoutExtension$.css |
| Output paths to refresh | $FileNameWithoutExtension$.css |
修改后（生成壓縮后css）
| 參數名 | 參數值(下面no和update前是兩個”-“) |
|---|---|
| Program | C:/Ruby23-x64/bin/scss.bat |
| Arguments | –no-cache –update -t compressed $FileName$:$FileNameWithoutExtension$.css |
| Output paths to refresh | $FileNameWithoutExtension$.css |
很簡單，比Less還要簡單。寫一段scss代碼試試。 
新聞熱點
疑難解答
