/*1.刪除gem源*/
gem sources --move
//2.新增國內gem源
gem sources --add
//3.檢查是否替換成功
gem sources -l
如果替換成功,會如下顯示:
在命令列中使用gem指令安裝sass 和compass。
gem install sass
gem install compass
好了。以上步驟完成之後,sass的環境就安裝好了。
sass的編譯有很多種方式,如命令列編譯模式,sublime外掛程式sass-build、編譯軟體koalad等等進行編譯:
命令列編譯
在乙個空目錄下建立乙個demo.scss檔案隨意書寫一些scss**,然後在這個目錄下,匯出cmd命令視窗,然後輸入如下命令
然後在該目錄下就會自動生成如下檔案(demo.css即為編譯好的css檔案)
以上方式每更改一次scss檔案內容,都要重新編譯一次,所以,sass提供了乙個監聽功能
//通過監視scss檔案,如若scss內容改變,那麼會自動開始編譯
sass --watch demo.scss:demo.css
//在命令列下關閉監聽 ctrl+c
sass --watch sass:stylesheets
命令列編譯配置選項命令列編譯sass的配置選項,如編譯過後css排版,生成除錯map,開啟debug資訊等,可以通過sass-v檢視詳細,常用的有兩種配置選項,–style –sourcemap
//
編譯格式
sass--
watch
input
.scss:output
.css--
style
compact
//編譯新增除錯map
sass--
watch
input
.scss:output
.css--
sourcemap
//選擇編譯格式並新增除錯map
sass--
watch
input
.scss:output
.css--
style
expanded--
sourcemap
//開啟debug資訊
sass--
watch
input
.scss:output
.css--
debug
-info
–style 表示解析之後的css的排版格式,sass內建的css排版格式有四種
nested expended(正常開發格式) compact compressed(壓縮格式)
軟體方式編譯 - koala
配置SASS環境
安裝sass 安裝好ruby之後,在開始介面會有乙個 start command prompt with ruby的檔案使用管理員身份開啟他 然後輸入命令 gem install sass 這個就是安裝sass了 但是有的時候會出錯那是因為被牆了不能安裝,一些大型 提供了一些映象下面就介紹用映象來安...
Sass 初識Sass與Koala工具的使用
找到合適的系統版本 並安裝 二 先新建乙個css資料夾,並在裡面新建乙個文字文件 txt 將其命名為demo.scss 三 開啟koala,將css資料夾拽進來,可以修改一下輸出方式 擴充套件 sass提供四個編譯風格的選項 四 又到了寫 的時候啦,隨便用一款文字編寫工具開啟demo.scss 1....
Sass教程九 Sass知識點之 繼承
extend 繼承 在設計網頁的時候常常遇到這種情況 乙個元素使用的樣式與另乙個元素完全相同,但又新增了額外的樣式。通常會在 html 中給元素定義兩個 class,乙個通用樣式,乙個特殊樣式。那麼通過 extend我們可以這樣寫 通用樣式 normal 特殊樣式 special 編譯過後 norm...