純干貨｜國內(nèi)國外的高大上的后臺管理系統(tǒng)模版分享，免費版的也太香了吧！（

時間：2023-06-15 06:09:02 | 來源：網(wǎng)站運營

時間：2023-06-15 06:09:02 來源：網(wǎng)站運營

純干貨｜國內(nèi)國外的高大上的后臺管理系統(tǒng)模版分享，免費版的也太香了吧！（附下載鏈接）：目錄

• 一、EasyUI
• 二、DWZ JUI
• 三、HUI
• 四、BUI
• 五、Ace Admin
• 六、Metronic
• 七、H+ UI
• 八、Admin LTE
• 九、INSPINIA
• 十、LigerUI
• 十一、FineUI
• 十二、其它UI
• 十三、總結(jié)下下載

最近要做一個企業(yè)的OA系統(tǒng)，以前一直使用EasyUI，一切都好，但感覺有點土了，想換成現(xiàn)在流行的Bootstrap為基礎(chǔ)的后臺UI風格，想滿足的條件應該達到如下幾個：

1、美觀、大方、簡潔

2、兼容IE8、不考慮兼容IE6/IE7，因為現(xiàn)在還有很多公司在使用Win7系統(tǒng)，系統(tǒng)內(nèi)置了IE8

3、能通過選項卡打開多個頁面，不想做單頁，iframe也沒關(guān)系

4、性能好，不要太笨重

5、最好以Bootstrap為基礎(chǔ)

6、還希望在以后別的系統(tǒng)中能夠復用。

一次次反復糾結(jié)的選擇開始了，給大家介紹下我考慮過的UI，也給大家一個參考。

一、EasyUI

easyui是一種基于jQuery的用戶界面插件集合。

easyui為創(chuàng)建現(xiàn)代化，互動，JavaScript應用程序，提供必要的功能。

使用easyui你不需要寫很多代碼，你只需要通過編寫一些簡單HTML標記，就可以定義用戶界面。

easyui是個完美支持HTML5網(wǎng)頁的完整框架。

easyui節(jié)省您網(wǎng)頁開發(fā)的時間和規(guī)模。

easyui很簡單但功能強大的。










優(yōu)點：輕量、功能強大、免費、兼容性好、幫助詳細、使用的人多生態(tài)好

缺點：非響應式布局、某些系統(tǒng)看起來有點土（客戶與老板的感覺、確實與最新的那些UI有差距）

獲得：上網(wǎng)搜索、網(wǎng)盤搜索大把被搭建好了基礎(chǔ)功能的框架。下載

下載后大家可以替換成最新的1.5版的easyui

官網(wǎng)：http://www.jeasyui.com/，有免費版，有商業(yè)版，商業(yè)版收費，幫助非常詳盡

資源：http://www.jeasyui.net/，easyui是國人的的作品，但服務器在國外，官網(wǎng)也是英文的，這個網(wǎng)站類似官網(wǎng)的中文版

二、DWZ JUI

特點：DWZ富客戶端框架(jQuery RIA framework), 是中國人自己開發(fā)的基于jQuery實現(xiàn)的Ajax RIA開源框架. 設(shè)計目標是簡單實用,快速開發(fā),降低ajax開發(fā)成本。

官網(wǎng)：http://jui.org/

下載：https://github.com/dwzteam/

三、HUI

H-ui前端框架是在bootstrap的思想基礎(chǔ)上基于 HTML、CSS、JAVASCRIPT開發(fā)的輕量級web前端框架,開源免費,簡單靈活,兼容性好,滿足大多數(shù)中國網(wǎng)站。分了前端UI與后端UI。

官網(wǎng)：http://www.h-ui.net/H-ui.admin.shtml 后臺，http://www.h-ui.net/ 前臺

下載：https://github.com/jackying/

缺點：感覺用的人少，名氣小，資料不全，配套組件不多，但國人的產(chǎn)品符合國人的口味。

四、BUI

BUI她是基于jQuery,兼容KISSY的UI類庫，專致于解決后臺系統(tǒng)的框架方案，BUI提供了豐富的DPL含有強大的控件庫對業(yè)務做了精細的分析。

官網(wǎng)：http://www.builive.com/

下載：https://github.com/dxq613/bui

感覺也比較冷、與HUI有點類似的優(yōu)點整體框架符合我的要求，但風格有種說不出的感覺。

五、Ace Admin

響應式Bootstrap網(wǎng)站后臺管理系統(tǒng)模板ace admin，非常不錯的輕量級易用的admin后臺管理系統(tǒng)，基于Bootstrap3，擁有強大的功能組件以及UI組件，基本能滿足后臺管理系統(tǒng)的需求，而且能根據(jù)不同設(shè)備適配顯示，而且還有四個主題可以切換。以前收費，好像最新版不再收費了。







下載：https://github.com/bopoda/ace

官網(wǎng)：http://ace.jeka.by/

感覺比較全，功能強大,組件多，美觀，只是用了很多不同的插件，兼容性不錯。

兼容的瀏覽器：

• Internet Explorer 10
• Internet Explorer 11
• Internet Explorer 8
• Internet Explorer 9
• Latest Chrome
• Latest Firefox
• Latest Opera
• Latest Safari

使用的插件：

View Code

使用到的插件并沒有分開存放，使用起來會麻煩一些。

另外該插件也被很多人簡化、修改成選項卡+iframe風格了。

六、Metronic

Metronic 是一套精美的響應式后臺管理模板，基于強大的 Twitter Bootstrap 框架實現(xiàn)。Metronic 擁有簡潔優(yōu)雅的 Metro UI 風格界面，6 種顏色可選，76 個模板頁面，包括圖表、表格、地圖、消息中心、監(jiān)控面板等后臺管理項目所需的各種組件。










頁面規(guī)范、精致、細膩、美觀大方；功能強大、非常全；在所有我看到過的基于Bootstrap的網(wǎng)站模版中，Metronic是我認為最優(yōu)秀的之一，其外觀之友好、功能之全面讓人驚嘆。Metronic 是一個自適應的HTML模版，提供后臺管理模版和前端內(nèi)容網(wǎng)頁模版兩種風格。

優(yōu)點：

支持HTML5 和 CSS3
自適應，基于響應式 Twitter Bootstrap框架，同時面向桌面電腦、平板、手機等終端。
整合AngularJS 框架。
可自定義管理面板，包括靈活的布局、主題、導航菜單、側(cè)邊欄等。
提供了部分電子商務模塊：CMS, CRM, SAAS。
多風格，提供了3個前端風格，7個后端管理面板風格。
簡潔扁平風格設(shè)計。
700多個網(wǎng)頁模版，1500多個UI小組件，100多個表單，80多個jQuery插件。
提供說明文檔。

缺點：

太大了，真的不知道從那里開始

對IE的兼容不好，雖然官方聲稱支持IE8，但我測試結(jié)果不支持

收費，今天的價格是$28

七、H+ UI

官網(wǎng)的介紹：H+是一個完全響應式，基于Bootstrap3.3.6最新版本開發(fā)的扁平化主題，她采用了主流的左右兩欄式布局，使用了Html5+CSS3等現(xiàn)代技術(shù)，她提供了諸多的強大的可以重新組合的UI組件，并集成了最新的jQuery版本(v2.1.4)，當然，也集成了很多功能強大，用途廣泛的jQuery插件，她可以用于所有的Web應用程序，如網(wǎng)站管理后臺，網(wǎng)站會員中心，CMS，CRM，OA等等，當然，您也可以對她進行深度定制，以做出更強系統(tǒng)。

官網(wǎng)：http://www.zi-han.net/theme/hplus/

與Metronic與INSPINIA非常像，插件非常多，收費998人民幣。

八、Admin LTE

AdminLTE 是一個基于Bootstrap 3.x的免費主題，它是一個完全響應式管理模板。高度可定制的，易于使用。適合從小型移動設(shè)備到大的臺式機很多的屏幕分辨率。




下載：https://github.com/almasaeed2010/AdminLTE （目前star 11652+）

預覽: http://almsaeedstudio.com/preview/

官網(wǎng)：Free Bootstrap Admin Template

瀏覽器支持：
IE 9+
Firefox (latest)
Chrome (latest)
Safari (latest)
Opera (latest)

插件

View Code

特點：

• 響應式布局，支持多種設(shè)備
• 打印增強
• 豐富可排序的面板組件
• 18個插件與3個自定義插件
• 輕量、快速
• 兼容主流瀏覽器，IE8不兼容
• 支持Glyphicons, Fontawesome和Ion圖標

整體感覺與Metronic類似、功能強大，UI精致，被許多公司使用。

評論中感謝網(wǎng)友（dotNetDR_、醉丶千秋）推薦，確定是值得關(guān)注的一個UI。

九、INSPINIA

INSPINIA是平面設(shè)計理念的管理模板。它是充分響應的由Bootstrap3 +框架開發(fā)的模板,HTML5和CSS3。它有很多可重用的UI組件和集成了最新的jQuery插件。它可以用于所有類型的web應用程序自定義管理面板中,項目管理系統(tǒng),管理儀表板,應用程序的后端,CMS或CRM。




與Metronic一樣，風格也比較像，個人認為比Metronic還要強大一些，頁面規(guī)范、精致、細膩、美觀大方；功能強大、非常全；在所有我看到過的基于Bootstrap的網(wǎng)站模版中，Metronic是我認為最優(yōu)秀的之一，其外觀之友好、功能之全面讓人驚嘆。Metronic 是一個自適應的HTML模版，提供后臺管理模版和前端內(nèi)容網(wǎng)頁模版兩種風格。

瀏覽器兼容：

• IE 9, 10, 11
• Latest Chrome
• Latest Firefox
• Latest Opera
• Latest Safari

收費，今天的價格是$18。

演示地址：http://wrapbootstrap.com/preview/WB0R5L90S

特點：




相對Metronic他準備了很多個版本，比如：

Static version, AngularJS, http://ASP.NET MVC5/MVC6, Meteor and Ruby on Rails version

插件很多，但都按引用分文件夾存放了，靜態(tài)版本中我看了就是48個插件，有PSD源文件，提供的文件包含：

View Code

詳細介紹：https://wrapbootstrap.com/theme/inspinia-responsive-admin-theme-WB0R5L90S

十、LigerUI

LigerUI 是基于jQuery 的UI框架，其核心設(shè)計目標是快速開發(fā)、使用簡單、功能強大、輕量級、易擴展。簡單而又強大，致力于快速打造Web前端界面解決方案，可以應用于.net,jsp,php等等web服務器環(huán)境。

官網(wǎng)：http://www.ligerui.com/

演示：http://www.ligerui.com/demo.html

特點：

使用簡單，輕量級
控件實用性強，功能覆蓋面大，可以解決大部分企業(yè)信息應用的設(shè)計場景
快速開發(fā)，使用LigerUI可以比傳統(tǒng)開發(fā)減少極大的代碼量
易擴展，包括默認參數(shù)、表單/表格編輯器、多語言支持等等
支持Java、.NET、PHP等web服務端
支持 IE6+、Chrome、FireFox等瀏覽器
開源，源碼框架層次簡單易懂。

下載：http://pan.baidu.com/s/1o83vRZk

API: http://api.ligerui.com/

演示地址: http://demo.ligerui.com/

源碼下載: http://git.oschina.net/ligerui/LigerUI/ (源碼托管)

http://pan.baidu.com/s/1D0AVO (V1.2.3)

技術(shù)支持： http://www.cnblogs.com/leoxie2011/

個人感覺文檔比較全，也有公司的信息系統(tǒng)使用了該UI（去年我去一家公司培訓他們就使用該UI，后面上頭說要換漂亮些的，他們糾結(jié)好久），但整合感覺比不上EasyUI，與DotNet親一點感覺，DWZ則與Java新一些。

LigerUI中國人開發(fā)的、免費。

十一、FineUI

基于 jQuery / ExtJS 的 http://ASP.NET 控件庫、創(chuàng)建 No JavaScript，No CSS，No UpdatePanel，No ViewState，No WebServices 的網(wǎng)站應用程序。

該UI也是國人的作品，開源、免費、至今有100多個版本了，個人感覺界面不算難看，控件多，幫助說明也有不少；但只是為http://ASP.NET量身定做的，有一定的局限性；重，非常重，ExtJS+http://ASP.NET的頁面狀態(tài)就更加重了。

官網(wǎng)：http://fineui.com/
論壇：http://fineui.com/bbs/
示例：http://fineui.com/demo/
文檔：http://fineui.com/doc/
下載：http://fineui.codeplex.com/

十二、其它UI

1. AdminLTE

Github Star 數(shù) 24969 ， Github 地址：

https://github.com/almasaeed2010/AdminLTE

非常流行的基于 Bootstrap 3.x 的免費的后臺 UI 框架。

2. vue-Element-Admin

Github Star 數(shù) 19546， Github 地址：

https://github.com/PanJiaChen/vue-element-admin

一個基于 vue2.0 和 Eelement 的控制面板 UI 框架。

3. tabler

Github Star 數(shù) 15870， Github 地址：

https://github.com/tabler/tabler

構(gòu)建在 BootStrap 4 之上的免費的 HTML 控制面板框架

4. Gentelella

Github Star 數(shù) 15654， Github 地址：

https://github.com/puikinsh/gentelella

一個基于 Bootstarp 的免費的后臺控制面板。

5. ng2-admin

Github Star 數(shù) 13181， Github 地址：

https://github.com/akveo/ngx-admin

基于 Angular 2, Bootstrap 4 和 Webpack 的后臺管理面板框架。

6. ant-design-pro

Github Star 數(shù) 12707，Github 地址：

https://github.com/ant-design/ant-design-pro

開箱即用的中臺前端/設(shè)計解決方案

7. blur-admin

Github Star 數(shù) 9241，Github 地址：

https://github.com/akveo/blur-admin

基于 Angular 和 Bootstrap 的后臺管理面板框架。

8. vue-admin

Github Star 數(shù) 8676，Github 地址：

https://github.com/vue-bulma/vue-admin

基于 Vue 和 Bulma 的控制面板。

9. iview-admin

Github Star 數(shù) 8668，Github 地址：

https://github.com/iview/iview-admin

基于 iView 的 Vue 2.0 控制面板。

10. material-dashboard

Github Star 數(shù) 7111，Github 地址：

https://github.com/creativetimofficial/material-dashboard

基于 Bootstrap 4 和 Material 風格的控制面板。

十三、總結(jié)下下載

沒有形式就沒有內(nèi)容、UI重要，特別是當客戶與老板不懂太多關(guān)于代碼、功能、性能的時候。

上面的UI你也許可以通過各種途徑獲得，但商業(yè)應用請慎重。

想來想去還是拿不定主意，不過有點想法：

1、使用HUI和bootstrap

2、使用EasyUI的框架，內(nèi)容頁使用HUI+BootStrap，iframe選項卡

3、從各個功能強大的頁面中拿一些插件過來

歡迎大家補充；

本文轉(zhuǎn)載>博客園:張果
原文鏈接：https://www.cnblogs.com/best/p/5782891.html