1.Ruby

sass是需要ruby語言支持的，所以先安裝 ruby .

2.SASS:是CSS語言的擴展，可以使用變量，嵌套規則，mixins(類似宏，使代碼重用), @import(引用其他scss文件))。與CSS語言完全兼容，使得大型的CSS文件，可以有組織。因為，可以分開多個sass文件，編譯后可以在一個css文件內，html文件可以只連接這個CSS文件，programmer可以動態管理sass文件。

sass? Documentation

sass安裝,

?

      gem install sass


    

sass 版本信息

      sass -v
    

3.Compass?是一個css的框架，使sass 樣式語言更加簡便和高效，

Compass? Documentation

安裝compass

      gem install compass


    

compass 版本信息

?

      compass -v
    

?

4.Prepros 是一個網頁設計和開發的工具，做預處理，和最優化，測試網頁，使得你的工作流在你的控制之中。

*編譯一切：預編譯LESS,Sass,SCSS,Stylus,Jade,Slim,Coffeescript,LiveScript,Haml,Markdown.

---------把路徑拖到prepros里面，當你的路徑中的SCSS文件發生變化時，相應的css文件也自動更新（cool!）,你可以選擇編譯出壓縮的CSS。

*JS 連接：當文件修改后，最小化和實時連接你的js。

*圖片最優化：最優化png，jpg,提高網頁加載速度

*1-Click FTP 發布：完全控制你即將發布的內容

*遠程設備的檢測：像Weinre一樣，檢測任何連接到你的ＬＡＮ的遠程的手機或平板利用chrome。

*可共享配置文件：通過prepros.json文件，共享項目和文件的設置，在不同的用戶，團隊成員，或電腦之間。

**多設備測試:可以測試任何連接到你的LAN的客戶服務器和設備，實時刷新。

*即時瀏覽器刷新：在有css注入時即時刷新瀏覽器，也刷新PHP,HTML&CSS文件

*內置http 服務器：1-click HTTP server 去測試網頁，沒有任何限制和file url.

?

5.Bracket是一個代碼編輯器，針對于網頁的開發。(for X OS)有個更令人喜愛的espresso

?

?

?

?

?

?

?

SASS + COMPASS + Prepros