設(shè)計(jì)ui最重要的就是要先設(shè)計(jì)好它的框架，因?yàn)橹挥性诳蚣艿拇笄疤嵯逻M(jìn)行設(shè)計(jì)，才能夠更好的保證自己的設(shè)計(jì)質(zhì)量，下面我們跟隨小編一起來(lái)了解一下ui設(shè)計(jì)框架的相關(guān)資料吧。

ui設(shè)計(jì)框架之Bootstrap

　　說(shuō)到流行的UI框架，那么Bootstrap是一定會(huì)出現(xiàn)在榜單上的。它是由twitter推出的Web前端UI框架，它由Twitter的設(shè)計(jì)師MarkOtto和JacobThornton合作開(kāi)發(fā)。Bootstrap通過(guò)它優(yōu)秀的柵欄系統(tǒng)，很好的實(shí)現(xiàn)了響應(yīng)式布局。Bootstrap還提供了時(shí)尚的排版樣式，表單，buttons，表格，輪播等等。

　　Bootstrap提供了優(yōu)雅的HTML和CSS規(guī)范，它是由動(dòng)態(tài)CSS語(yǔ)言Less寫(xiě)成。Bootstrap一經(jīng)推出后頗受歡迎，一直是GitHub上的熱門(mén)開(kāi)源項(xiàng)目。國(guó)內(nèi)一些移動(dòng)開(kāi)發(fā)者較為熟悉的框架，如WeX5前端開(kāi)源框架等，也是基于Bootstrap源碼進(jìn)行性能優(yōu)化而來(lái)。

（圖片來(lái)自網(wǎng)絡(luò)）

　　ui設(shè)計(jì)框架之jQuery UI

　　jQuery UI 是建立在jQuery JavaScript 庫(kù)上的一組用戶(hù)界面交互、特效、小部件及主題。無(wú)論是創(chuàng)建高度交互的Web 應(yīng)用程序還是僅僅向窗體控件添加一個(gè)日期選擇器，jQueryUI 都是一個(gè)完美的選擇。

　　jQuery UI 包含了許多維持狀態(tài)的小部件(Widget)，因此，它與典型的jQuery 插件使用模式略有不同。所有的jQuery UI 小部件(Widget)使用相同的模式，這樣就大大的降低了學(xué)習(xí)成本。

　　jQuery UI 繼承jQuery 簡(jiǎn)易使用特性，提供高度抽象接口，短期改善網(wǎng)站易用性。同時(shí)，jQueryUI采用MIT & GPL 雙協(xié)議授權(quán)，輕松滿足自由產(chǎn)品至企業(yè)產(chǎn)品各種授權(quán)需求。jQueryUI另一大有點(diǎn)是兼容各主流桌面瀏覽器。包括IE6+、Firefox2+、Safari3+、Opera9+、Chrome1+。而且，jQueryUI有完全漢化的版本，開(kāi)發(fā)包內(nèi)置包含中文在內(nèi)的40 多種語(yǔ)言包。

（圖片來(lái)自網(wǎng)絡(luò)）

　　ui設(shè)計(jì)框架之Pure CSS

　　Pure也是一款很出色的CSS框架。盡管從UI界面效果上來(lái)說(shuō)，Pure沒(méi)有Bootstrap那樣精美，但Pure是純CSS實(shí)現(xiàn)的，因此非常小巧，整個(gè)框架壓縮后只有5.7k左右。

　　最大的特點(diǎn)就是框架基于純CSS，無(wú)任何JavaScript代碼，渲染速度比較快。組件也很豐富，包括表格、表單、按鈕、表、導(dǎo)航等。CSS類(lèi)的標(biāo)識(shí)十分簡(jiǎn)單，因此在使用Pure的過(guò)程中代碼會(huì)比較友好。

（圖片來(lái)自網(wǎng)絡(luò)）

　　ui設(shè)計(jì)框架之Semantic UI

　　SemanticUI最大的優(yōu)點(diǎn)就在它的名字里--語(yǔ)義化。Semantic-UI比Bootstrap更語(yǔ)義化，使用了更容易理解的標(biāo)簽名稱(chēng)：導(dǎo)航的是nav，主要內(nèi)容的是main，class名也很明確。

　　而且SemanticUI 的modules預(yù)制了很多美觀的動(dòng)畫(huà)，同時(shí)也非常簡(jiǎn)單好用。比如視圖(Views)中的評(píng)論(Comment)和動(dòng)態(tài)信息(Feed) 。

（圖片來(lái)自網(wǎng)絡(luò)）

　　ui設(shè)計(jì)框架之Ace Admin

　　Ace 是一個(gè)輕量、功能豐富、HTML5、響應(yīng)式、支持手機(jī)及平板電腦上瀏覽的管理后臺(tái)模板，基于CSS框架Bootstrap制作，Bootstrap版本更新至3.0，Ace–Responsive Admin Template當(dāng)前最新版!Ace的一大特點(diǎn)就是擁有豐富的組件。集成了很多經(jīng)典的jquery插件，如zTree，dropzone等。很好的滿足后臺(tái)管理的各種需求。

（圖片來(lái)自網(wǎng)絡(luò)）

　　ui設(shè)計(jì)框架之BootMetro

　　BootMetro是一款基于Bootstrap的前端UI框架，BootMetro的特點(diǎn)是可以很方便地構(gòu)建類(lèi)似Windonws8扁平化風(fēng)格的網(wǎng)頁(yè)界面，效果非常不錯(cuò)。

（圖片來(lái)自網(wǎng)絡(luò)）

　　其實(shí)小編覺(jué)得ui設(shè)計(jì)框架是大同小異的，其關(guān)鍵就在于設(shè)計(jì)過(guò)程可能會(huì)有所不同，所以大家可以根據(jù)自己的實(shí)際情況來(lái)選擇最適合自己的ui設(shè)計(jì)的框架哦!