使用sass

sass安裝 compass安裝

1.sass 須要安裝ruby,而後經過gem安裝sass.

2. less有想=兩種安裝方:

客戶端安裝:
引入less.js,而後就能夠直接用.less文件

<link rel="stylesheet/less" type="text/css" href="文件路徑"/style.less>
<script src="文件路徑/less.js" > </script>

服務器安裝 安裝node,使用npm安裝less

1.安裝ruby

http://www.ruby-lang.org/zh_cn/downloads/

2.查看ruby版本

ruby -v

3.安裝sass

gem install sass

4. 查看 sass版本

sass -v

5.安裝compass

gem install compass

6.建立目錄

compass create chen

在sass文件新建demo.scss文件

7.命令行進入當前目錄compass編譯

在寫代碼以前，咱們還要知道如何編譯。由於咱們寫出來的是後綴名爲scss的文件，只有編譯成css文件，才能用在網站上。
Compass的編譯命令是

compass compile

• 有四種編譯模式

1. 嵌套輸出方式 nested
2. 展開輸出方式 expanded  
3. 緊湊輸出方式 compact 
4. 壓縮輸出方式 compresse

該命令在項目根目錄下運行，會將sass子目錄中的scss文件，編譯成css文件，保存在stylesheets子目錄中。
默認狀態下，編譯出來的css文件帶有大量的註釋。可是，生產環境須要壓縮後的css文件，這時要使用--output-style參數。

compass compile --output-style expanded    // 壓縮模式