sass(scss)的安裝與使用


CSS預編譯器有 SASS LESS Stylus等等,SCSS是SASS3引入的新語法。那為什么要選擇SCSS呢?那我只能說我喜歡啊!不管SASS也好,LESS也罷,還是Stylus都只是一種工具,各有各的優缺點,選擇自己喜歡的用着舒服的就是了。沒必要糾結這么多。

准備工作(注意:這是windows平台下的安裝)
1.1 安裝
  SASS是Ruby語言寫的,但是兩者的語法沒有關系。所以不懂Ruby,一樣可以使用。只是必須先安裝Ruby,然后再安裝SASS。

  根據自己系統的位數(64 OR 32)選擇合適的安裝包,下載安裝包之后雙擊打開,一路下一步,完成!

  

 

  打開ruby的控制台,輸入ruby -v,如果出現以下結果,則證明ruby安裝成功!

ruby -v

   

 

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

gem install sass

  至此,SCSS安裝完畢!

1.2 使用

    SASS文件就是普通的文本文件,里面可以直接使用CSS語法。文件后綴名是.scss,意思為Sassy CSS。
下面的命令,可以將.scss文件轉化的css代碼並保存到一個新文件中。(假設文件名為app。)

sass app.scss app.css

     SASS提供四種編譯風格的選項:

nested:嵌套縮進的css代碼,它是默認值。
expanded:沒有縮進的、擴展的css代碼。
compact:簡潔格式的css代碼。
compressed:壓縮后的css代碼。

    編碼風格自行設置,用一次就知道了嘛。

1.3 安裝Koala

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

  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM