你應該知道的9個優秀的CSS框架
前端開發是一項非常繁瑣的工作，你不僅需要擁有和別人不一樣的審美觀和設計觀，而且需要了解諸如HTML、CSS、JavaScript等錯綜復雜的技術，因此選擇一些優秀的CSS框架或許可以幫助你大大提高工作效率。本文向你推薦了9個還不錯的CSS框架，希望對你有所幫助。
1、推ter開源杰作 - Bootstrap
Bootstrap是一款由推ter推出的開源CSS框架，它的核心是由一系列用于Web前端開發的工具包組成。Bootstrap基于 HTML、CSS和JavaScript，是一款非常適合敏捷Web開發的CSS框架，Bootstrap同時也是Github上最熱門的開源項目之一。
Bootstrap的特點
- 強大的開發團隊。Bootstrap由推ter的設計師Mark Otto和Jacob Thornton合作開發，Bootstrap開發團隊也是國際上公認最優秀的前端開發團隊之一。
- 極簡的框架。Bootstrap的設計非常簡單，這就意味著，無論你是高級的前端設計師，還是普通的程序員，都能夠很快地掌握Bootstrap的開發流程和開發方式。
- 跨設備、跨瀏覽器最初設想的Bootstrap只支持現代瀏覽器，不過新版本已經能支持所有主流瀏覽器，甚至包括IE7。從Bootstrap 2開始，提供對平板和智能手機的支持。
- 完美的響應式設計。Bootstrap支持響應式布局，可以智能識別客戶端瀏覽器的類型，從而構造適應當前設備前端布局，這一切都是全自動的。
- 支持HTML5和CSS3。Bootstrap支持所有的HTML5標簽和CSS3屬性。
- 使用LESS構建動態樣式。當傳統的枯燥CSS寫法止步不前時，LESS技術橫空出世。LESS使用變量、嵌套、操作、混合編碼，幫助用戶花費很小的時間成本，編寫更快、更靈活的CSS。 </ul>
- 包含很多基本的用戶界面，同時也可以靈活創建更多自定義的UI界面組件
- 包含豐富的矢量圖標和符號
- 自定義調色板
- 基于HTML / CSS、JavaScript的布局 </ul>
- 文檔和演示非常完善
- 易于學習和使用
- 配備網格布局
- 支持 Sass 和 LESS 動態樣式語言
- 有一些非常實用的附加配置，例如inverted類。
- 對于社區貢獻來說是比較開放的。
- 有一個非常好的按鈕實現，情態動詞，和進度條。
- 在許多功能上使用圖標字體。 </ul>
- 基于強大的推ter Bootstrap，框架的靈感源于 Metro UI CSS
- 讓用戶更專注于網站的內容，因為Metro風格可以更加突出網頁的主要內容。
- 完全免費，和Bootstrap一樣，BootMetro的使用也是非常簡單。 </ul>
- 最大的特點就是框架基于純CSS，無任何JavaScript代碼，渲染速度比較快。
- 由Yahoo出品，技術上應該不存在太大問題。
- 框架十分小巧，壓縮后僅5.7k。
- 組件也很豐富，包括表格、表單、按鈕、表、導航等。
- CSS類的標識十分簡單，因此在使用Pure的過程中代碼會比較友好。 </ul>
- Win 8 Metro風格，界面清爽平滑
- 學習非常簡單
- 源代碼很小巧
- 基于MIT開源協議 </ul>
- 安裝非常方便。只需要下載對應主題的CSS文件，替換原來的文件即可，無需安裝二進制文件。
- 完全開源。基于MIT開源協議，你也可以前往Bootswatch的開源社區進行問題討論。
- 模塊化。可以更加靈活地控制和改變樣式。
- 插件化。已經為各個平臺提供了API，如果你在使用NodeBB, BootSnap，那么就更加方便了。
- 持續更新中。更新和維護是一款優秀開源軟件的標志。 </ul>
- 基于jQuery UI，因此控件功能非常強大，可以使用全部的jQuery UI控件。
- 基于Bootstrap，不同控件有了統一的外觀。
- 免費開源，你可以很方便地下載和使用。 </ul>
- 最大的特點就是框架很小，才1K，因此可以將其集成到任何相應的樣式表中。
- 簡化排版，原先需要很復雜的CSS代碼才實現的排版布局，EZ-CSS可以分分鐘搞定。
- 輕松實現多列布局，并且可以指定任意的寬度。 </ul>
2、扁平化UI開發包 - Flat UI
Flat UI是一款基于Bootstrap的扁平化前端UI工具包，Flat UI的組件外觀設計非常清新和漂亮，Flat UI的組件包含按鈕，輸入框，組合按鈕，復選框，單選按鈕，標簽，菜單，進度條和滑塊等精美的元素。
Flat UI的特點
3、語義化前端開發框架 - Semantic UI
Semantic UI 是一款語義化的前端開發框架，Semantic是圍繞自然交流語言而架構的，這使得開發更加直觀（易于理解）。跟Bootstrap不同，Semantic在功能特性上、布局設計上、用戶體驗上更貼近自然語言。
Semantic UI的特點
4、Metro風格的CSS框架 - BootMetro
和Flat UI一樣，BootMetro同樣也是一款基于Bootstrap的CSS框架，BootMetro的最大特點在于它是一款Win 8 Metro風格的CSS框架。Metro風格的優勢在于界面簡潔平滑，UI元素簡單，加載速度快，并且有不錯的視覺效果。
BootMetro的特點
5、雅虎開源杰作 – Pure
Pure也是一款很出色的CSS框架，之前分享的Bootstrap是由推ter出品的，而Pure是來自雅虎的。盡管從UI界面效果上來說，Pure沒有Bootstrap那樣精美，但Pure是純CSS實現的，因此非常小巧，整個框架壓縮后只有5.7k左右。
Pure的特點
6、Win 8 Metro風格的CSS框架 - Metro UI CSS
Metro UI CSS 是一款Win 8 Metro風格的CSS框架，同時，之前介紹過的那款BootMetro也是基于Metro UI CSS的，我們可以利用Metro UI CSS構建很棒的Metro風格應用。
Metro UI CSS 的特點
7、免費的Bootstrap主題包 - Bootswatch
Bootswatch 是一款基于 Bootstrap 的免費主題包，其中包含了豐富的 Bootstrap 主題，你可以下載安裝這些主題的 CSS 文件，實現各種各樣漂亮的 Bootstrap 主題風格。
Bootswatch 的特點
8、集成在jQuery UI上的Bootstrap - jQuery UI Bootstrap
jQuery UI Bootstrap是一個將jQuery UI集成到Bootstrap上的CSS框架，jQuery UI Bootstrap不僅可以利用jQuery UI強大的控件庫，同時還可以享受Bootstrap那種清新自然的主題風格，所以越來越多的前端開發者都在使用jQuery UI Bootstrap。
jQuery UI Bootstrap的特點
9、輕量級CSS布局排版框架 – EZ-CSS
EZ-CSS是一款輕量級的CSS布局排版框架，EZ-CSS和其他的CSS框架有很大的不同，因為它很小，才1kb。而且EZ-CSS的擴展性很強，對瀏覽器兼容性較為友好，利用EZ-CSS，你可以快速的實現較為復雜的網頁布局排版。
EZ-CSS的特點
還有很多優秀的CSS框架，我們正在為大家努力收集，希望這些CSS框架資源對你有所幫助。
本文鏈接： http://原網站已經失效/article/9-css-framework.html本文作者： 碼農網 – 小峰