之前咪挺時知道有 Sass 這東西 … 過了幾個禮拜後才花一些時間大概看了一下 …
安裝方式：
(for MAC)
# gem install sass
然後就可以開啟編輯器寫 Sass 了，寫完後再透過指令將 Sass 轉為 CSS
# sass --watch style.scss:style.css
Sass 是 CSS 的 extension，並提供了許多新的功能，像是 nested rules, variables, mixin functions 等 …
讀到目前我覺得最酷的是 mixin functions … 真的非常實用啊啊 !
舉個例子來說
@mixin rounded ($side, $radius: 10){
...
...
}
#navbar li { @include rounded(top); }
#footer { @include rounded(top, 5px); }
等於是可以傳不同的參數至 function … 不用再因為一點點不同的值而將整個 CSS 寫得很冗長
決定以後寫 CSS 都用 Sass 了 !
一些參考：
http://sass-lang.com/tutorial.html
http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#output_style
另外，剛在看 Sass 時看到了 Compass
還沒去研究 Compass，不過看了一下幾行的介紹，好像是 CSS Framework
有空的話再來研究一下吧 !
#navbar li { @include rounded(top); }
#footer { @include rounded(top, 5px); }
等於是可以傳不同的參數至 function … 不用再因為一點點不同的值而將整個 CSS 寫得很冗長
決定以後寫 CSS 都用 Sass 了 !
一些參考：
http://sass-lang.com/tutorial.html
http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#output_style
另外，剛在看 Sass 時看到了 Compass
還沒去研究 Compass，不過看了一下幾行的介紹，好像是 CSS Framework
有空的話再來研究一下吧 !
沒有留言:
張貼留言