隨着CSS3和HTML5的流行,咱們的WEB頁面不只須要更人性化的設計理念,並且須要更酷的頁面特效和用戶體驗。做爲開發者,咱們須要瞭解一些寶貴的CSS UI開源框架資源,它們能夠幫助咱們更快更好地實現一些現代化的界面,包括一些移動設備的網頁界面風格設計。本文分享了10個頂級的CSS UI開源框架,有幾個確實不錯,一塊兒來看看。
一、Bootstrap – 最流行的Web前端UI框架
Bootstrap是由twitter推出的Web前端UI框架,它由Twitter的設計師Mark Otto和Jacob Thornton合做開發,是一個CSS/HTML框架。它使用了最新的瀏覽器技術,Bootstrap提供了時尚的排版樣式,表單,buttons,表格,網格系統等等。
官方網站:http://getbootstrap.com/
二、jQuery UI - 基於jQuery的開源Javascript框架
jQuery UI是一款基於jQuery的開源Javascript框架,jQuery UI框架主要提供了用戶交互、動畫、特效和可更換主題的可視控件,讓開發者能夠更方便地實現網頁交互界面,jQuery UI的整個框架比較龐大,但你也能夠根據本身須要使用的功能生成適合本身的框架底層。jQuery UI界面設計很是漂亮,值得一試。
官方網站:http://jqueryui.com/
三、jQuery UI Bootstrap
它是jQuery UI和Bootstrap的集成,它是Bootstrap樣式的,所以外觀比較漂亮,同時它擁有jQuery UI的控件功能,這也方便開發者快速地建立一個網頁控件。
官方網站:https://github.com/jquery-ui-bootstrap/jquery-ui-bootstrap/
四、BootMetro - Metro風格的CSS框架
BootMetro是一款基於Bootstrap的前端UI框架,BootMetro的特色是能夠很方便地構建相似Windonws 8扁平化風格的網頁界面,效果很是不錯。
官方網站:http://aozora.github.io/bootmetro/
五、Flat UI - 扁平風格 UI 工具包
Flat UI是一套精美的扁平風格 UI 工具包,基於 Twitter Bootstrap 實現。這套界面工具包含許多基本的和複雜的 UI 部件,例如按鈕,輸入框,組合按鈕,複選框,單選按鈕,標籤,菜單,進度條和滑塊,導航元素等等。
官方網站:https://github.com/designmodo/Flat-UI
六、網易CSS框架 NEC
NEC是網易推出的開源前端CSS框架,NEC提供了豐富UI代碼庫和插件,能夠極大的幫助開發人員提升開發效率。即便你並不是前端專業開發人員,利用NEC你也能夠快速地構建屬於本身的網頁應用。
官方網站:http://nec.netease.com/
七、Alloy UI – 功能強大的CSS UI框架
Alloy UI是基於YUI 3的前段UI框架,包含一套豐富的(超過60)UI 部件,如圖片庫,對話框,樹形結構,面板,自動完成,按鈕,日曆控件,工具條等。
官方網站:http://alloyui.com/
八、Cardinal – 移動端的CSS UI框架
Cardinal 是一個小型的移動優先的 CSS 框架,提供不少有用的默認樣式、可縮放排版、可重用模塊和一個簡單的響應式表格系統
官方網站:http://cardinalcss.com/
九、快速開發CSS的框架 CSScaffold
不一樣於許多CSS框架,它必須依靠PHP與Apache的mod_rewrite來執行,但也由於須要這兩種東西,讓CSScaffold變得很神奇、很方便,寫起CSS來又快又輕鬆!
官方網站:http://www.w3avenue.com/2009/10/13/csscaffold-php-based-css-framework/
十、後臺UI開發框架 MuseUI
一款基於bootstrap風格,兼容於主流瀏覽器(包括IE6)的後端UI開發組件。
官方網站:http://git.oschina.net/muse/museuiphp
web前端培訓到知海匠庫互聯網學院,核心管理來自網易系:http://www.zhihaijiangku.comcss