一、 手机端UI框架1.1 WeUI
来自:腾讯
详情(https://weui.io/)
1.2 SUI Mobile
来自:阿里
SUI Mobile 是一套基于 Framework7 开发的UI库。它非常轻量、精美,只需要引入我们的CDN文件就可以使用,并且能兼容到 iOS 6.0 和 Android 4.0 ,非常适合开发跨平台Web App。轻量的UI库
详情(http://m.sui.taobao.org/)
SUI Mobile 非常轻量,核心库压缩Gzip后的JS、CSS网络传输体积总共只有52K,却提供了20 个常用的组件。
1.3 Amaze ~ 妹子 UI
中国首个开源 HTML5 跨屏前端框架
详情(http://amazeui.org/)
Amaze UI 以移动优先(Mobile first)为理念,从小屏逐步扩展到大屏,最终实现所有屏幕适配,适应移动互联潮流。
Amaze UI 含近 20 个 CSS 组件、20 余 JS 组件,更有多个包含不同主题的 Web 组件,可快速构建界面出色、体验优秀的跨屏页面,大幅提升开发效率。
Amaze UI 面向 HTML5 开发,使用 CSS3 来做动画交互,平滑、高效,更适合移动设备,让 Web 应用更快速载入。
1.4 jQuery mobile
jQuery移动是一个基于html5的用户界面系统,为响应web站点和应用程序都可以访问所有的智能手机,平板电脑和桌面设备而设计。
详情(https://jquerymobile.com/)
1.5 Framework7
Framework7 是一个开源免费的框架可以用来开发混合移动应用(原生和HTML混合)或者开发 iOS & Android 风格的WEB APP。也可以用来作为原型开发工具,可以迅速创建一个应用的原型。
详情(http://framework7.taobao.org/)
Framework7 最主要的功能是可以使用HTML、CSS和JS来开发iOS7应用。Framework7 是完全免费开源的。
Framework7 并不能兼容所有的设备。她只专注于为 iOS 和 Google Material 设计提供最好的体验。
如果你想开发 iOS 或者 Android 混合应用(Phonegap)或者你想开发 iOS 和 Google Material 风格的WEB APP,那么Framework7将会是你的首选。
二、Web端UI框架2.1 EasyUI
easyui是一种基于jQuery的用户界面插件集合。easyui为创建现代化,互动,JavaScript应用程序,提供必要的功能。
详情(http://www.jeasyui.net/)
使用easyui你不需要写很多代码,你只需要通过编写一些简单HTML标记,就可以定义用户界面。
easyui是个完美支持HTML5网页的完整框架。
easyui节省您网页开发的时间和规模。
easyui很简单但功能强大的。
2.2 Bootstrap
简洁、直观、强悍的前端开发框架,让web开发更迅速、简单。
详情(http://www.bootcss.com/)
2.3 jQuery UI
jQuery UI 是建立在 jQuery JavaScript 库上的一组用户界面交互、特效、小部件及主题。无论您是创建高度交互的 Web 应用程序还是仅仅向窗体控件添加一个日期选择器,jQuery UI 都是一个完美的选择。
详情(https://jqueryui.com/)
jQuery UI 包含了许多维持状态的小部件(Widget),因此,它与典型的 jQuery 插件使用模式略有不同。所有的 jQuery UI 小部件(Widget)使用相同的模式,所以,只要您学会使用其中一个,您就知道如何使用其他的小部件(Widget)。
2.4 SUI
SUI 是一套基于bootstrap开发的前端组件库,同时她也是一套设计规范。
详情(http://sui.taobao.org/sui/docs/index.html)
通过SUI,可以非常方便的设计和实现精美的页面。
2.5 ZUI
一个基于 Bootstrap 深度定制开源前端实践方案,帮助你快速构建现代跨屏应用。
详情(http://zui.sexy/)
2.6 Plane UI
HTML5 跨终端响应式前端界面框架
详情(https://pandao.github.io/planeui/)
2.7 Semantic UI
Semantic UI 是一款语义化设计的前端开源框架,其功能强大,使用简单,为设计师和开发师提供可复用的完美设计方案。
详情(http://www.semantic-ui-cn.com/)
2.8 materialize
基于谷歌material design设计的框架。
详情(http://materializecss.com/)