17款面向CSS開發人員的實用框架及工具
幾乎每一天我們都以找到值得分享的實用工具，幫助大家在CSS開發這條探索之路上找到新的光明前景與幾乎無盡的可能性。遙想當初，我們一路見證了CSS的成長，而如今我們能夠不容置疑地斷言，CSS已經成為Web開發領域的PhotoShop。
就在幾個月之前，我們曾經列舉過一些能夠幫助大家簡化開發任務的出色CSS工具，而去年我們也發布過兩篇關于CSS的博文——其中主要探討了如何利用CSS繪圖工具以及對CSS框架及網格系統進行最小化處理（以上各鏈接皆為英文原文）以創建出令人驚艷的彩色拼貼圖案。
在今天的文章中，我們將從其它角度著眼，繼續就CSS展開探討。如果大家打算投身于Web設計與開發工作當中，并發現自己需要經常使用CSS來處理 日常任務，那么此份清單中所列舉的工具及框架將成為很好的立足根基。從這里出發，各位將一步步了解到業界大牛們是如何運用此類工具完成杰作的。
最后提一句，也歡迎各位將自己最喜愛的方案選項通過評論分享給更多朋友。
SMACSS的惟一關注重點就是效率，特別是針對身處團隊環境下的用戶朋友們。大家是否曾經發現自己處在被動狀態，需要不斷編寫并重寫CSS代碼才 能讓一切正常運作？SMACSS正是為了此類希望在大型項目當中編寫簡單代碼，而又不希望純粹依靠生成大量代碼的方式完成任務的朋友們所準備。如果大家感 興趣，請點擊此處查看來自Envato網站的一篇簡介文章，這也是最適合的SMACSS起步指南。
Unsemantic是一款流體網格系統，其屬于960 Grid System的繼任解決方案。它的工作方式與前輩差不多，但摒棄了原本的大量列數，其轉而以百分比作為基礎。Unsemantic看起來似乎將一部分注意 力放在了搜索引擎功能方面，同時也考慮到了如何利用其改進整體代碼對于機器人機制的可閱讀性。
就目前來看，市面上的大多數CSS框架仍然顯得不夠成熟，其中大部分仍然要求我們以特定方式編寫代碼，而這自然也就帶來了額外的學習與整合難度曲 線。Susy則是一款出色的網格系統，允許大家以自己最為熟悉的方式完成代碼編寫工作，而用不著再學習諸多保證開發任務順暢實現的必要知識。感興趣的朋友 可以點擊此處查看Zell-Weekeat.com網站上的文章，了解Susy如何幫助各位構建出更為出色的Web設計成果。
大家是不是屬于需要頻繁訪問GitHub的常客？我猜答案多半是肯定的。不過各位可能還沒有意識到，GitHub其實是使用自己的一款內部CSS工 具包來支撐整套網站的。這意味著我們見到的幾乎一切都遵循著一種特定風格，包括布局、按鈕樣式乃至字體選擇等等。就在今年，這款工具包已經以開源姿態走到 我們面前，這就是Primer。感興趣的朋友可以點擊此處在Markdotto.com網站上查看這款新型工具包的簡介文章。
時至今日，Web已經成為一臺出產豐富的機器，我們單憑各類Web開發語言即可拿出令人眼花繚亂的成果。而在這方面，我們擁有Loaders.css助陣; 這是一款體積小巧的庫，能夠提供28款獨特的載入器，并允許大家直接拿來加以使用。
Jeet不僅是我個人長久以來所見過的最出色的網站，其同時也是我在整個工作經歷當中遇到過的最理想的網格系統——而且我敢肯定，我絕不是惟一一個 作此論斷的用戶。Jeet事實上是一款CSS預處理工具。在它的幫助下，我們不再受到.col-6等類的局限; 相反，大家能夠將任何分數、小數或者兩者的結合添加進去，從而創建出一套完全自定義而成的網格方案。
相信大家一定會愛上Transformicons，因為它充分顯示出JavaScript與CSS相結合后能夠創造出怎樣令人驚艷的成果。Transformicons是一套庫，旨在幫助大家將SCG與CSS圖標轉化成不同形狀。
這套CSS3 Collection能夠幫助大家將懸停功能引入到各類鏈接、按鈕、標志、SVG乃至特色圖像等對象之上。在它的支持下，我們可以輕松應用自己的元素，修 改或者直接使用自己的創意與靈感。Hover適用于CSS、Sass以及LESS。它也能夠實現我們在iPhone應用程序當中常見的各種懸停效果，這也 進一步證明了在不久的將來，我們將有能力直接以Web方式開發移動應用程序。
Bourboun原本曾被冠以多種不同的名頭，但不管名稱如何、它最引人注目的特性仍然在于作為Bootstrap可靠備選方案的重要作用。就本身 而言，Bourbon屬于一套輕量級框架; 但在與其它有趣的軟件包相結合之后，它也能夠變身成一款強大而且簡潔的框架、幫助大家創建并編寫獨立代碼。
Spritebox是一款適用于所有Sprites用戶的解決方案，它同時也是一款所見即所得類型的工具——因此我們沒必要針對它的功能另行贅言。需要強調的是，它可能是目前我們能夠找到的、可利用單一sprite圖像生成CSS的最便捷解決方案之一。
Font Awesome之所以能夠被納入此次榜單，理由非常簡單：它是目前面向CSS開發者群體的最具人氣的字體資源。沒有哪個項目能夠在不具備理想字體屬性的條 件下順利完成，而這套資源則是大家所能獲得的最佳選擇。就在不久之前，我們還剛剛發布了一份SVG圖標資源清單（點擊此處查看，英文原文），其中包含大量 值得關注的方案。此外，各位可能還會對Font Awesome to PNG這一服務抱有興趣，其作用是將Font Awesome圖標輕松快捷地轉換為獨立圖像。
Stitches是一款HTML 5 sprite表生成工具。對它，我們沒有太多需要贅述的，上傳圖像后即可輕松獲取到sprite表——就這么簡單。
如果大家打算像專業人士那樣編寫CSS，那么Sass絕對是各位的最佳選擇——或者至少是最佳選擇之一。總體而言，它能夠讓我們的CSS編碼工作改 頭換面，從而使大家感受到如何使用真正的編程語言那樣的編寫過程。在這里，我們強烈推薦大家點擊此處查看Sass使用指南——它將為各位節約下大量用于摸 索的時間！
Less又是另一款出色的CSS預處理工具，而且在過去幾個月當中相關社區內還針對Less能否繼續保持發展態勢而進行了一番討論。一部分技術人員 認為現在是時候完全投入Sass的懷抱了，但也有一些持不同的觀點。值得一提的是，Chris Coyer也加入到了這場熱火朝天的討論當中，感興趣的朋友可以點擊此處查看相關內容（英文原文）。
PHP在預處理樣式表方面擁有著驚人的實力。PHP同樣有能力處理自己的內部變量，并以實時方式在樣式表處理過程中同代碼進行協作。這套動態環境允 許大家完成各類具有深度且復雜性較高的設計。Turbine CSS在很大程度與Sass比較類似，其能夠利用各類獨立PHP插件的優勢以實現多種功能，具體包括瀏覽器定位以及高級設計變量等等。感興趣的朋友可以點 擊此處（英文原文），通過這篇文章了解Turbine的作用與能力。
我們在今天的文章中著力強調了各類預處理解決方案，但各款上榜工具都在努力通過獨具特色的方式提供不同的實現角度，Myth當然也不例外。Myth 最大的差異之處在于，它無法真正使用獨特的語法機制，而是根據每款瀏覽器的各自支持能力、起效規范以及參考建議給出彼此不同的解決途徑。就目前來看，隨著 各類規范的不斷發展，我們的最終目標將是不借助Myth的力量而將各種瀏覽器納入統一范疇。這有點像是以尚未真正到來的方式編寫CSS代碼。
Stylus是一種革命性的新型語言，其允許使用者以一種有效的、動態的表達方式來生成CSS代碼。此外，它還同時支持縮進語法與常規CSS樣式。
原文標題：17 Useful Frameworks and Tools for CSS Developers
來自：http://developer.51cto.com/art/201506/481483_all.htm