CSS開發框架compass
最近在學習一個游戲開發框架,除了開發語言是最新的之外,給我的影響比較深的是國外的開發者擅長利用開發工具來提高項目的效率和質量,在這里跟大家介紹一個css開發框架compass。

什么是compass?
compass基于sass,是一個真正意義上的編程框架,提供了大量的mixin(可理解為函數庫),無論是對css3繁雜的多瀏覽器寫法的簡化支持,還是實現各種常見功能的helper,都是強大而豐富的。
為什么要使用compass?
在Web開發的過程中,使用CSS的是很普遍的,雖然CSS本身并不復雜,但在大型網站中如何去有序地組織好CSS結構卻是一個相當棘手的問題。為了解決開發者的這些問題,就有了Sass的出現。Sass 的全稱是 (Syntactically Awesome Stylesheets),是一種輸出CSS的meta編程語言, 可以幫助開發者寫出復用性更優的CSS文件: 它能將類似CSS但是更簡便的書寫的sass語言最終轉換為CSS代碼。
compass開發框架語法特征
變量:
Sass中以”$”號打頭的$name都是變量。我們可以給變量賦值,然后在文件中使用它們。
繼承:
- A、繼承其它選擇器的屬性:.error {border: 1px}; .subError {@extend .error};
- B、在選擇器中屬性插入”&”它就會繼承父選擇器:a: {color:black; &:hover {color:blue}}
內嵌:
這個功能將另外一個急需的特性加入CSS:將選擇器嵌入到其他等級,而不是不得不取消在一些高級選擇器定義中嵌套。Sass翻譯器將這個簡潔的特性擴展到了CSS。
混合類型:允許開發者抽象出性質的共同點,然后命名并且加入到選擇器中。熟悉Ruby混合類型的開發者會了解混合類型在CSS中的應用。Sass也允許將混合類型作為參數,使得混合類型的應用更加靈活。
操作:
Sass支持簡單的算術操作,例如+-×/,以及函數。將這個特性和變量結合起來,會使得CSS變得更加靈活。工具需要保證操作的單位(px, pt)正確性(例如字體大小等, width: 1in + 8pt,將某顏色亮度增加10%: lighten(yellow, 10%))。
Sass語言支持的函數列表在這里: http://sass-lang.com/docs/yardoc/Sass/Script/Functions.html