CSS預(yù)編譯器有 SASS LESS Stylus等等，SCSS是SASS3引入的新語法。那為什么要選擇SCSS呢？那我只能說我喜歡??！不管SASS也好，LESS也罷，還是Stylus都只是一種工具，各有各的優(yōu)缺點，選擇自己喜歡的用著舒服的就是了。沒必要糾結(jié)這么多。

準(zhǔn)備工作（注意：這是windows平臺下的安裝）

• Ruby
• SASS

1.1 安裝　　

SASS是Ruby語言寫的，但是兩者的語法沒有關(guān)系。所以不懂Ruby，一樣可以使用。只是必須先安裝Ruby，然后再安裝SASS。

　　根據(jù)自己系統(tǒng)的位數(shù)（64 OR 32）選擇合適的安裝包，下載安裝包之后雙擊打開，一路下一步，完成！

　　打開ruby的控制臺，輸入ruby -v，如果出現(xiàn)以下結(jié)果，則證明ruby安裝成功！

ruby -v

　　安裝完ruby之后，直接在控制臺就可以安裝SASS。

gem install sass

　　至此，SCSS安裝完畢！

1.2 使用

SASS文件就是普通的文本文件，里面可以直接使用CSS語法。文件后綴名是.scss，意思為Sassy CSS。  

下面的命令，可以將.scss文件轉(zhuǎn)化的css代碼并保存到一個新文件中。（假設(shè)文件名為app。）

sass app.scss app.css

SASS提供四種編譯風(fēng)格的選項：

nested：嵌套縮進(jìn)的css代碼，它是默認(rèn)值。 expanded：沒有縮進(jìn)的、擴展的css代碼。 compact：簡潔格式的css代碼。 compressed：壓縮后的css代碼。

編碼風(fēng)格自行設(shè)置，用一次就知道了嘛。

1.3 安裝KoalaKoala

Koala是一款圖形化界面的編譯軟件，支持Sass Less CoffeeScript的編譯。官網(wǎng)下載直接安裝，不過需要依賴于Ruby。具體安裝就不做介紹了。

以上所述是小編給大家介紹的sass(scss）的安裝與使用教程，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！

最新評論