一、jQuery Mobile

jQuery Mobile 是jQuery在移动设备上的版本,做为主要针对移动设备的框架来说,它提供一个移动设备平台统一的接口来兼容不同的移动平台,其特性包括:

1.简单易用
2.渐进增强和优雅降级
3.Accessibility
4.小规模
5.主题设置
6.跨平台

官网:http://jquerymobile.com/

学习容易,资料丰富,但早期的版本使用时非常卡,也早期的硬件也有关系,后续版本在性能方面有改进。

二、Framework7

覆盖了原生iOS应用所能呈现的一切内容,

官网:http://framework7.taobao.org/

三、SUI Mobile

阿里巴巴共享业务事业部UED团队

SUI Mobile 是阿里巴巴共享业务事业部SDC团队(UED)提供的一套手机UI库。
我们的目的是为手机千牛、百川以及任何手机端的H5页面提供标准的设计规范和前端实现。
SUI Mobile并没有重新发明轮子,我们主要参考了 ratchet 和 Framework7
这里只是一个官方示例,详细文档请参考:http://m.sui.taobao.org/

四、WeUI

WeUI是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信 Web 开发量身设计,可以令用户的使用感知更加统一。包含button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素。

演示:https://weui.io/

github:https://github.com/weui/

五、Ionic

融合AngularJS、Cordova、社区活跃

官网:http://ionicframework.com/

示例:http://view.ionic.io/

六、Sencha Touch

Sencha Touch(源于ExtJS、非常接近原生界面)

前不久基于JavaScript编写的Ajax框架ExtJS,将现有的ExtJS整合JQTouch、Raphaël库,推出适用于最前沿Touch Web的Sencha Touch框架,该框架是世界上第一个基于HTML5的Mobile App框架。同时,ExtJS更名为Sencha,JQTouch的创始人David Kaneda,以及Raphaël的创始人也已加盟Sencha团队。

Sencha Touch可以让你的Web App看起来像Native App。美丽的用户界面组件和丰富的数据管理,全部基于最新的HTML5和CSS3的 WEB标准,全面兼容Android和Apple iOS设备。
下面是Sencha官方给出的几点特性
1.基于最新的WEB标准 – HTML5,CSS3,JavaScript。整个库在压缩和gzip后大约80KB,通过禁用一些组件还会使它更小。
2.支持世界上最好的设备。Beta版兼容Android和iOS,Android上的开发人员还可以使用一些专为Android定制的主题。
3.增强的触摸事件。在touchstart、touchend等标准事件基础上,增加了一组自定义事件数据集成,如tap、swipe、pinch、rotate等。
4.数据集成。提供了强大的数据包,通过Ajax、JSONp、YQL等方式绑定到组件模板,写入本地离线存储。

官网:https://www.sencha.com/

中文网:http://extjs.org.cn/

七、Bootstrap

Bootstrap (v4移动设备优先、简洁灵活)

特点:Bootstrap是基于HTML5和CSS3开发的,它在jQuery的基础上进行了更为个性化和人性化的完善,形成一套自己独有的网站风格,并兼容大部分jQuery插件。

官网:https://getbootstrap.com/

中文网:http://www.bootcss.com/

源码:https://github.com/twbs/bootstrap/

八、HBuilder (MUI+HTML5Plus)

官网:http://www.dcloud.io/index.html

参照:http://www.cnblogs.com/best

前端学习笔记——移动前端UI选择的更多相关文章

  1. Web前端学习笔记之前端跨域知识总结

    0x00 前言 相信每一个前端er对于跨域这两个字都不会陌生,在实际项目中应用也是比较多的.但跨域方法的多种多样实在让人目不暇接.老规矩,碰到这种情况,就只能自己总结一篇博客,作为记录. 0x01 什 ...

  2. 【前端】Web前端学习笔记【1】

    ... [2015.12.02-2016.02.22]期间的学习笔记. 相关博客: Web前端学习笔记[2] 1. JS中的: (1)continue 语句 (带有或不带标签引用)只能用在循环中. ( ...

  3. Web前端学习笔记(001)

    ....编号    ........类别    ............条目  ................明细....................时间 一.Web前端学习笔记         ...

  4. 【前端】Web前端学习笔记【2】

    [2016.02.22至今]的学习笔记. 相关博客: Web前端学习笔记[1] 1. this在 JavaScript 中主要有以下五种使用场景 在全局函数调用中,this 绑定全局对象,浏览器环境全 ...

  5. web前端学习笔记

    web前端学习笔记(CSS盒子的定位) 相对定位 使用相对定位的盒子的位置常以标准流的排版方式为基础,然后使盒子相对于它在原本的标准位置偏移指定的距离.相对定位的盒子仍在标准流中,它后面的盒子仍以标准 ...

  6. Vue学习笔记-vue-element-admin 前端学习

    一  使用环境 开发系统: windows 后端IDE: PyCharm 前端IDE: VSCode 数据库: msyql,navicat 编程语言: python3.7  (Windows x86- ...

  7. Android:日常学习笔记(8)———探究UI开发(2)

    Android:日常学习笔记(8)———探究UI开发(2) 对话框 说明: 对话框是提示用户作出决定或输入额外信息的小窗口. 对话框不会填充屏幕,通常用于需要用户采取行动才能继续执行的模式事件. 提示 ...

  8. OpenGL学习笔记:拾取与选择

    转自:OpenGL学习笔记:拾取与选择 在开发OpenGL程序时,一个重要的问题就是互动,假设一个场景里面有很多元素,当用鼠标点击不同元素时,期待作出不同的反应,那么在OpenGL里面,是怎么知道我当 ...

  9. go语言,golang学习笔记2 web框架选择

    go语言,golang学习笔记2 web框架选择 用什么go web框架比较好呢?能不能推荐个中文资料多的web框架呢? beego框架用的人最多,中文资料最多 首页 - beego: 简约 & ...

随机推荐

  1. MVC与WebForm的区别

    在初步了解MVC后,发现很多人对于MVC和三层架构开发概念上会有很大的混淆,所以把这两天的学习笔记整理一下,分享给自己的同学们.同时也做一个小Demo,让没有接触过MVC开发的同学,能对MVC有一个简 ...

  2. 在drawable 画胶囊状

    <solid android:color="@color/colorAccent"></solid> <corners android:radius= ...

  3. jQuery源码分析系列:Callback深入

    关于Callbacks http://www.cnblogs.com/aaronjs/p/3342344.html $.Callbacks()的内部提供了jQuery的$.ajax() 和 $.Def ...

  4. 前端学PHP之语句

    × 目录 [1]if语句 [2]switch [3]while[4]do-while[5]for语句[6]foreach[7]break[8]continue[9]goto 前面的话 任何 PHP 脚 ...

  5. 深入理解DOM事件类型系列第一篇——鼠标事件

    × 目录 [1]类型 [2]顺序 [3]坐标位置[4]修改键[5]相关元素[6]鼠标按键[7]滚轮事件[8]移动设备 前面的话 鼠标事件是web开发中最常用的一类事件,毕竟鼠标是最主要的定位设备.本文 ...

  6. 深入理解脚本化CSS系列第一篇——脚本化行内样式

    × 目录 [1]用法 [2]属性 [3]方法 前面的话 脚本化CSS,通俗点说,就是使用javascript来操作CSS.引入CSS有3种方式:外部样式,内部样式和行间样式.本文将主要介绍脚本化行间样 ...

  7. 创建外网 ext_net - 每天5分钟玩转 OpenStack(104)

    虽然外部网络是已经存在的网络,但我们还是需要在 Neutron 中定义外部网络的对象,这样 router 才知道如何将租户网络和外部网络连接起来. 上一节我们已经为创建外部网络配置了ML2,本节将通过 ...

  8. Web APi之手动实现JSONP或安装配置Cors跨域(七)

    前言 照理来说本节也应该讲Web API原理,目前已经探讨完了比较底层的Web API消息处理管道以及Web Host寄宿管道,接下来应该要触及控制器.Action方法,以及过滤器.模型绑定等等,想想 ...

  9. easyui-datagrid 列单击事件

    首先要注意的就是,先添加一个js方法,名字可以自定义,但是必须得与下面的option里面的onClickRow:后面的一致即可      <script type="text/java ...

  10. Expression Template(表达式模板,ET)

    1.前言 在前一篇文章自己实现简单的string类中提到在实现+操作符重载函数时,为了防止返回时生成的临时对象调用拷贝构造函数动态申请内存空间,使用了一个叫move的函数,它是C++0x新增的特性.既 ...