手机HTML5开发,大部分都使用现有的框架,这里简单比较几个流行的UI 框架。作者(启明星工作室 http://www.dotnetcms.org) 比较一下几款流行的HTML5框架,个人意见,仅供参考。

(1)MUI

网址: http://dev.dcloud.net.cn/mui/

优点:MUI是数字dclound推出的一款流行框架,个人感觉,这是目前最好的一个H5 UI框架,使用简单,操作方便。

缺点:MUI为了达到原生效果,重新定义了Form表单里input,select,textarea所有的样式,这给用户自定义样式带来的不便。

例如下图左图是MUI里,直接使用标签,是没有下拉箭头的,这会让用户迷惑。

右图,我们可以在HTML代码里,重新定义select让其显示。

select{-webkit-appearance:menulist !important;

}

其实,我在用bootstrap时,到想起当时bootstrap开发人员在定义table时的一句话,他们说他们本可以通过CSS重写table,但是,因为有些网站需要原始的table样式,所以,为了和前者兼容,他们方式了

通过全局CSS改变table默认样式,如果开发人员像使用bootstrap的table样式,只要增加

我认为这点值得MUI借鉴。

(2)WeUI

优点:WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信内网页和微信小程序量身设计,令用户的使用感知更加统一。所以,其样式基本上核微信“长”的一样。

缺点:抱歉,我对WeUI的评价不高,这和腾讯的大名完全不符。我原本对WeUI期望甚高,结果实际测试非常令人失望。这些失望表现在太过于微信化,限制了他是使用广度。

更主要的是,其CSS名称与其他H5框架完全不一样,以简单的面板为例,公认的命名方式为:

标题
主体

但weui的命名类似如下:header缩写成了hd,body所写成了bd,类的名称,你叫做page__title也没问题,问题是page和title之间是2个下划线,而有些采用类名称采用:中划线和下划线一起用。

如weui-cell__hd。当你大量编写页面时,你脑子里会不停的切换想着WeUI类到底叫什么名字。

Title

手机

WeUI还有一个致命缺点:多一个span或者div都可能使得你的样式完全失效。例如如下,可能仅仅在body与tab__hd之间多了一个div,就会导致你页面失效。

(3)Jquery Mobile

优点:这应该是最早的HTML5框架,

缺点:Jquery虽然很流行,但是不得不说JqueryMobile是一个失败的作品。现在好像都停止更新了。JM最大的缺点是速度太慢。

这也难怪,浏览器支持的是CSS与JS,但是JM通过自定义很多data-*来重写渲染最终的样式,

例如如下代码的 data-enhanced,data-icon,这些data-*属性,浏览器并不能识别,需要JM的JS引擎解释后,转换为CSS语言,

当页面大量使用这些data-*属性时,其性能极具下降,现在应该没什么人使用了。

(4)Bootstrap

优点:兼容PC和手机,其推出的理念与样式,启发了很多后起之秀,例如将页面分成12份,根据分辨率不同,自动组合灯。在PC样式上,具有不可替代的作用。

缺点:也正因为他需要兼容PC和手机,使得虽然PC样式很优秀,但是手机效果只能说是“中规中矩”,毕竟“又想马儿跑得快,又想马儿不吃草”是不现实的。

(5)Framework7

没用过,但是看起来还不错,值得推挤。

(6)Amaze UI

没用过,其实Amaze有 基于 React.js 的移动端 Web 组件库   http://t.amazeui.org 因为是基于React.js的,感觉入门门槛挺高

(7)Layui

网址 http://www.layui.com

Layer目前人气极具上升,不过她还是偏重于PC

html5游戏视频UI框架,几款流行的HTML5 UI 框架比较相关推荐

  1. 素描小子跑酷html5游戏在线玩,推荐14款强大的HTML5素描及绘图工具

    1. Mr. Doobs Harmony 如果你喜欢涂鸦,可以试试这款工具,它有各种各样的画笔可用于绘图. 2. Sketch 一款叫Hakim El Hattab的人开发的一款素描工具,可绘制三维图 ...

  2. 几款流行的HTML5 UI 框架比较

    手机HTML5开发,大部分都使用现有的框架,这里简单比较几个流行的UI 框架.作者(启明星工作室 http://www.dotnetcms.org) 比较一下几款流行的HTML5框架,个人意见,仅供参 ...

  3. html5 pc ui,几款流行的HTML5 UI 框架比较

    手机HTML5开发,大部分都使用现有的框架,这里简单比较几个流行的UI 框架.比较一下几款流行的HTML5框架,个人意见,仅供参考. (1)MUI 网址: http://dev.dcloud.net. ...

  4. 一款简约好看的html5音乐播放器,HTML5 之美:推荐9款优秀的 HTML5 音乐播放器

    过去,在网页上播放音频都是通过第三方插件来播放的,如 Flash.QuickTime 和 Silverlight 等,没有统一的音频播放标准.HTML5 通过 audio 元素来提供在网页中嵌入音频的 ...

  5. android 可编辑的表格框架,smartTable-一款android自动生成表格框架---A Android automatically generated table framework...

    一款android自动生成表格框架功能介绍 1. 快速配置自动生成表格: 2. 自动计算表格宽高: 3. 表格列标题组合: 4. 表格固定左序列.顶部序列.第一行.列标题.统计行: 5. 自动统计,排 ...

  6. html5游戏视频UI框架,推荐几个精致的web UI框架

    Aliceui是支付宝的样式解决方案,是一套精选的基于 spm 生态圈的样式模块集合,是 Arale 的子集,也是一套模块化的样式命名和组织规范,是写 CSS 的更好方式. 2.Amazeui Ama ...

  7. android 动画开源框架,21款炫酷动画开源框架,照亮你的APP

    前言 最近对应用的UI视觉效果突然来了兴致,所以找了一些合适开源控件,这样更加省时,再此分享给大家,希望能对大家有帮助,此博文介绍的都是UI上面的框架. 1.Side-Menu.Android 分类侧 ...

  8. disruptor框架为什么不流行_Java并发编程框架Disruptor

    Disruptor是什么? Disruptor是一个高性能的异步处理框架,一个轻量级的JMS,和JDK中的BlockingQueue有相似处,但是它的处理速度非常快,获得2011年程序框架创新大奖,号 ...

  9. html5游戏读取音效源码,为你的html5网页添加音效示例

    为交互添加恰当的音效,常常能改善用户体验.在我们所熟悉的windows里,清空回收站的碎纸声就是很好的例子. 下面是一个利用HTML5, Jquery,给页面添加音效的小组件(只是添加音效,并不是播放 ...

  10. html5 游戏 动画设计,11款效果惊艳的HTML5动画应用

    11款效果惊艳的HTML5动画应用 来源:极客头条 HTML5真的很棒,我们这个网站也每天在为大家分享很多炫酷而实用的HTML5和CSS3应用.今天要分享的有很多效果惊艳而且好玩的HTML5动画应用, ...

最新文章

  1. codis3.2升级redis3.11到redis6.0.10调研
  2. 整理一下自己手撸的博客
  3. C++11 类型后置语法
  4. 【知识星球】图像降噪模型和数据集内容开启更新,经典问题永垂不朽!
  5. 全球及中国养老护理行业十四五趋势前景与投资动向建议报告2022版
  6. 2个html文件顺序播放,CSS3两个动画顺序衔接播放
  7. Spring Boot学习总结(8)——SpringBoot Common application properties(application.properties)详解
  8. 在线工具-程序员的工具箱-在线Cron表达式生成器
  9. Android : First step – Download and build
  10. JavaSE入门学习10:Java修饰符
  11. 一行代码解决各种IE兼容问题,IE6,IE7,IE8,IE9,IE10 (转)
  12. 更新K3官改里面都FRP到0.20版本的方法
  13. mdx 医学词典_Mdict的mdx词典文件如何解析,有相关的开源代码可以参考吗?
  14. 【大数据】分布式机器学习平台
  15. JVM-运行时数据区:Java堆(Heap) 内存管理的核心区
  16. Either类java_基于Java8的Either类
  17. CAN总线网络知识(一)
  18. passive-interface 总结整理
  19. QTextEdit 控件的妙用(以及与QPlainTextEdit的区别)
  20. 基于HTML电商项目的设计与实现——html静态网站基于数码类电商购物网站网页设计与实现共计30个页面

热门文章

  1. python中re模块的span_python3正则模块re的使用方法详解
  2. Bone Collector——01背包
  3. DX11编程之计算着色过滤器
  4. 如何使用 CSS 颜色?
  5. GO语言安装(windows)
  6. python3实战练习:快递价格计算器
  7. h5和mysql做图书系统_HTML5的WebGL3D档案馆图书可视化管理系统的实现
  8. 硬笔书法三要素:笔法、结构和章法
  9. c语言求解一元二次方程的复根,c语言 求一元二次方程的根(含复根)
  10. 这45个场景,正在被区块链抽筋扒皮…