后台管理UI皮肤的接纳

后台管理UI的取舍

目录

近年来要做3个商店的OA系统,此前平昔利用EasyUI,一切都好,但感觉有点土了,想换到将来风靡的Bootstrap为底蕴的后台UI风格,想满意的口径应该达到如下多少个:

1、美观、大方、简洁

贰 、包容IE⑧ 、不考虑兼容IE6/IE7,因为明日还有很多同盟社在利用Win7系统,系统内置了IE8

③ 、能经过选项卡打开两个页面,不想做单页,iframe也没提到

肆 、质量好,不要太笨重

5、最好以Bootstrap为基础

六 、还盼望在以后其他系统中可以复用。

五回次往往纠结的取舍起来了,给我们介绍下本身设想过的UI,也给咱们3个参考。

一、EasyUI

easyui是一种基于jQuery的用户界面插件集合。

easyui为创造现代化,互动,JavaScript应用程序,提供要求的功效。

采用easyui你不须求写过多代码,你只必要通过编制一些大致HTML标记,就足以定义用户界面。

easyui是个周详帮助HTML5网页的共同体框架。

easyui节省您网页开发的时光和范围。

easyui很简短但功效强大的。

图片 1

图片 2

优点:轻量、效用强大、免费、包容性好、协理详细、使用的人多生态好

症结:非响应式布局、有些系统看起来有点土(客户与业主的感到、确实与前卫的那么些UI有反差)

收获:上网查找、网盘搜索大把被搭建好了基础成效的框架。下载

下载后大家可以替换到最新的1.5版的easyui

官网:http://www.jeasyui.com/,有免费版,有商业版,商业版收费,支持特别详尽

资源:http://www.jeasyui.net/,easyui是国人的的著述,但服务器在外国,官网也是英文的,这些网站类似官网的汉语版

二、DWZ JUI

特征:DWZ富客户端框架(jQuery LANDIA framework),
是礼仪之邦人团结付出的依照jQuery完成的Ajax 宝马7系IA开源框架.
设计目标是简约实用,快速支付,下落ajax开发花费。

图片 3

官网:http://jui.org/

下载:https://github.com/dwzteam/

三、HUI

H-ui前端框架是在bootstrap的思考根基上根据HTML、CSS、JAVASCLANDIPT开发的轻量级web前端框架,开源免费,不难利落,包容性好,知足一大半中国网站。分了前端UI与后端UI。

图片 4

图片 5

官网:http://www.h-ui.net/H-ui.admin.shtml
后台,http://www.h-ui.net/ 前台

下载:https://github.com/jackying/

症结:感觉用的人少,名气小,资料不全,配套零件不多,但国人的成品符合国人的口味。

四、BUI

BUI她是基于jQuery,包容KISSY的UI类库,专致于化解后台系统的框架方案,BUI提供了丰裕的DPL含有强大的控件库对作业做了精美的剖析。

图片 6

官网:http://www.builive.com/

下载:https://github.com/dxq613/bui

备感也正如冷、与HUI有点类似的长处全体框架符合小编的渴求,但作风大胆说不出的痛感。

五、Ace Admin

响应式Bootstrap网站后台管理系列模板ace
admin,非凡不利的轻量级易用的admin后台管理连串,基于Bootstrap3,拥有强劲的功用组件以及UI组件,基本能满意后台管理连串的须要,而且能根据不一致装备适配突显,而且还有多个主题得以切换。以前收费,好像最新版不再收费了。

图片 7

图片 8

图片 9

图片 10

下载:https://github.com/bopoda/ace

官网:http://ace.jeka.by/

感觉到相比较全,作用强大,组件多,美观,只是用了无数例外的插件,包容性不错。

匹配的浏览器:

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

利用的插件:

图片 11

图片 12

jQuery 2.0.3

jQuery UI 1.10.3 (Custom Build)

Twitter Bootstrap 3.0.0

FontAwesome 3.2.1

Google "Open Sans" Font

jQuery Flot Charts 0.8.1

jQuery Sparklines 2.1.2

Easy Pie Chart 1.2.5

jQuery Knob 1.2.0

jQuery Validate 1.11.1

FuelUX 2.3.0 (Spinner & Wizard & Treeview)

FullCalendar 1.6.4

jQuery ColorBox 1.4.27

jQuery dataTables 1.9.4

jQuery Chosen 1.0

jQuery Masked Input 1.3.1

jQuery Input Limiter 1.3.1

jQuery AutoSize 1.17.7

Bootstrap Colorpicker

Bootstrap Datepicker

Bootstrap Timepicker v0.2.3

Bootstrap DateRange Picker 1.2

Bootbox.js 4.0.0

jQuery Gritter 1.7.4

jQuery slimScroll 1.1.1

Spin.js 1.3.0

jQuery UI Touch Punch 0.2.2

Google Code Prettify

ExplorerCanvas

Mindmup Wysiwyg Editor

Toopay Markdown Editor 1.1.4

X-editable 1.4.6

Select2 3.4.2

Bootstrap Tags 2.2.5

jQuery Mobile 1.3.2 (Custom Build)

jqGrid 4.5.2

Dropzone.js 3.0

Nestable lists plugin

图片 13

运用到的插件并不曾分开存放,使用起来会麻烦一些。

别的该插件也被不少人简化、修改成选项卡+iframe风格了。

六、Metronic

Metronic 是一套精美的响应式后台管理模板,基于强大的 推特(TWTR.US) Bootstrap
框架已毕。Metronic 拥有简洁优雅的 Metro UI 风格界面,6 种颜色可选,七14个模板页面,包罗图片、表格、地图、消息大旨、监控面板等后台管理项目所需的各样零部件。

图片 14

图片 15

图片 16

页面规范、精致、细腻、美观大方;作用强大、非凡全;在富有小编看来过的依据Bootstrap的网站模板中,Metronic是本身觉得最了不起的之
一,其外观之协调、效能之周全令人奇怪。Metronic
是三个自适应的HTML模版,提供后台管理模版和前端内容网页模版三种风格。

优点:

支持HTML5 和 CSS3
自适应,基于响应式 推特Bootstrap框架,同时面向桌面电脑、平板、手机等终端。
整合AngularJS 框架。
可自定义管理面板,包罗灵活的布局、核心、导航菜单、侧边栏等。
提供了有的电子商务模块:CMS, C纳瓦拉M, SAAS。
多风格,提供了三个前端风格,多少个后端管理面板风格。
精简扁平风格设计。
700三个网页模版,1500多个UI小组件,100三个表单,80八个jQuery插件。
提供验证文档。

缺点:

太大了,真的不晓得从那里初阶

对IE的匹配不佳,即便合法注明协理IE8,但本人测试结果不接济

收费,前几天的价位是$28

图片 17

七、H+ UI

官网的牵线:H+是一个截然响应式,基于Bootstrap3.3.6新颖版本开发的扁平化宗旨,她选用了主流的左右两栏式布局,使用了
Html5+CSS3等现代技术,她提供了过多的无敌的可以重新组合的UI组件,并集成了时尚的jQuery版本(v2.1.4),当然,也集成了许多效能强大,用途广泛的jQuery插件,她得以用来全数的Web应用程序,如网站管理后台,网站会员中央,CMS,C奇骏M,OA等等,当然,您也足以对她进行深度定制,以做出更强系统。

图片 18

官网:http://www.zi-han.net/theme/hplus/

与Metronic与INSPINIA格外像,插件卓殊多,收费99五位民币。

八、Admin LTE

AdminLTE 是多少个依据Bootstrap
3.x的免费大旨,它是一个一心响应式管理模板。中度可定制的,易于使用。适合从小型移动设备到大的台式机很多的屏幕分辨率。

图片 19

图片 20

图片 21

下载:https://github.com/almasaeed2010/AdminLTE (目前star 11652+)

预览: http://almsaeedstudio.com/preview/

官网:Free Bootstrap Admin
Template

浏览器支持:
IE 9+
Firefox (latest)
Chrome (latest)
Safari (latest)
Opera (latest)

插件:

图片 22

图片 23

Boostrap Slider
Ion slider
Bootstrap WYSIHTML5
CKEditor
Bootstrap Colorpicker
Bootstrap Date range Picker
Bootstrap Time Picker
Data Tables
Flot
Morris.js
Sparkilne
Full Calendar
iCheck
jQuery input mask
jQuery Knob
jVector Map
Slim Scroll
Pace
Bootstrap Social Buttons

图片 24

特点:

  • 响应式布局,辅助各个配备
  • 打印增强
  • 增进可排序的面板组件
  • 二十一个插件与一个自定义插件
  • 轻量、快速
  • 合作主流浏览器,IE8不匹配
  • 支持Glyphicons, Fontawesome和Ion图标

全体感觉与Metronic类似、功能强大,UI精致,被众多铺面利用。

评价中多谢网友(dotNetDR_醉丶千秋)推荐,显然是值得关切的3个UI。

九、INSPINIA

INSPINIA是平面设计理念的军事管制模板。它是尽量响应的由Bootstrap3
+框架开发的模板,HTML5和CSS3。它有过多可采用的UI组件和集成了最新的jQuery插件。它能够用来全体品种的web应用程序自定义管理面板
中,项目管理种类,管理仪表板,应用程序的后端,CMS或CSportageM。

图片 25

图片 26

图片 27

与Metronic一样,风格也相比较像,个人认为比Metronic还要强大一些,页面规范、精致、细腻、赏心悦目大方;功效强大、卓殊全;在有着小编看
到过的按照Bootstrap的网站模板中,Metronic是自个儿觉得最了不起的之一,其外观之协调、功效之周详令人好奇。Metronic
是二个自适应的HTML模版,提供后台管理模版和前端内容网页模版三种风格。

浏览器包容:

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

收费,明天的价格是$18。

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

特点:

图片 28

相对Metronic他准备了好四个本子,比如:

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

插件很多,但都按引用分文件夹存放了,静态版本中自作者看了就是肆拾九个插件,有PSD源文件,提供的公文包蕴:

图片 29

图片 30

Static Full Version
Static Seed Project
MVC5 Full Version
MVC5 Seed Project
MVC6 Full Version (.NET RC1)
MVC6 Seed Project (.NET RC1)
Ruby on Rails Full Version
Ruby on Rails Seed Project
Meteor Full Version
Meteor Seed Project
Angular Full Version
Angular Seed Project
Angular Seed Project Grunt
Angular Seed Project Gulp
Angular Seed Project MEANJS
Documentation
Landing Page
LESS
SASS
SCSS
PSD Files (more than 20 main views and components full layered)

图片 31

详尽介绍:https://wrapbootstrap.com/theme/inspinia-responsive-admin-theme-WB0R5L90S

十、LigerUI

LigerUI 是依据jQuery
的UI框架,其中央设计目的是便捷支付、使用简易、成效强大、轻量级、易扩充。不难而又有力,致力于火速创设Web前端界面消除方案,能够动用于.net,jsp,php等等web服务器环境。

图片 32

图片 33

图片 34

官网:http://www.ligerui.com/

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

特点:

应用简易,轻量级
控件实用性强,功用覆盖面大,可以化解一大半企业消息运用的筹划场景
神速支付,使用LigerUI可以比传统支付裁减极大的代码量
易增加,包涵暗中同意参数、表单/表格编辑器、多语言协助等等
支持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)

技术辅助: http://www.cnblogs.com/leoxie2011/

个人感觉文档比较全,也有铺面的新闻种类拔取了该UI(二零一八年本人去一家商户造就他们就应用该UI,前边上头说要换雅观些的,他们纠结好久),但结合感觉比不上EasyUI,与DotNet亲一点感觉,DWZ则与Java新一些。

LigerUI中国人付出的、免费。

十一、FineUI

依据 jQuery / ExtJS 的 ASP.NET 控件库、成立 No JavaScript,No CSS,No
UpdatePanel,No ViewState,No WebServices 的网站应用程序。

图片 35

该UI也是同胞的著述,开源、免费、于今有100多个版本了,个人感觉界面不算难看,控件多,辅助说明也有那3个;但只是为ASP.NET量身定做的,有一定的局限性;重,非凡重,ExtJS+ASP.NET的页面状态就尤其深了。

官网:http://fineui.com/ 
论坛:http://fineui.com/bbs/ 
示例:http://fineui.com/demo/ 
文档:http://fineui.com/doc/ 
下载:http://fineui.codeplex.com/ 

十二、其它UI

图片 36

图片 37

十三、总结

从没方式就从未内容、UI首要,特别是当客户与CEO不懂太多关于代码、功效、品质的时候。

上边的UI你只怕能够因此种种路子获取,但生意使用请慎重。

想来想去依旧拿不定主意,但是某些想法:

1、使用HUI和bootstrap

② 、使用EasyUI的框架,内容页使用HUI+BootStrap,iframe选项卡

叁 、从各种作用强大的页面中拿一些插件过来

迎接大家补充;