好用web前端ui框架,html5是框架吗

　　现有的框架大多用于手机的HTML5开发。下面简单对比几个流行的UI框架。笔者对比了几种流行的HTML5框架，给出个人观点，仅供参考。

（1）MUI

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

　　优点：MUI是Digital dclound推出的流行框架。个人认为是目前最好的H5 UI框架，好用，易操作。

　　缺点：MUI为了达到原生效果，在表单Form中重新定义了input、select、textarea的所有样式，给用户自定义样式带来不便。

　　比如下面左图，在MUI中，直接使用了select标签，没有下拉箭头，会让用户感到困惑。

　　在右边，我们可以在HTML代码中重新定义select来显示它。

　　选择{ -webkit-appearance: menulist！重要；}其实我在用bootstrap的时候，想起了bootstrap开发者当时定义table时说过的一句话。他们说他们可以通过CSS重写表格。但是，因为有些网站需要原始的表格样式，所以他们这样做是为了兼容前者。

　　通过全局CSS改变表格的默认样式。如果开发者喜欢使用bootstrap的表格样式，只需要添加table即可。这样既不会增加太多工作量，又能兼容过去的程序。

　　我觉得这一点值得梅姐学习。

（2）WeUI

　　网址：https://weui.io/

　　优点：WeUI是一套与微信原有视觉体验一致的基础样式库。微信官方的设计团队设计了网页和微信的小程序，让用户的感知更加统一。所以它的风格和微信“龙”基本一致。

　　缺点：不好意思，我对WeUI评价不高，和腾讯的名字完全不符。我对WeUI抱有很高的期望，但实际测试非常令人失望。这些失望表现在过于微信化，限制了他使用的广度。

　　更重要的是，它的CSS名称与其他H5框架完全不同。以一个简单的面板为例。公认的命名方法是：

　　class= panel div class= panel panel-header title/div div class= panel panel-body body/div但是weui的名字和下面差不多：header缩写为hd，body写成bd，类的名字可以叫page__title。问题是页面和标题之间有两条下划线，而其中一部分采用了类名：

　　例如weui-cell__hd。当你写了很多页的时候，你的思维会不断切换，思考WeUI类的名字。

　　div class= page panel Div class= page _ _ HD h1 class= page _ _ title title/h1/Div class= page _ _ BD Div class= weui-cell Div class= weui-cell _ _ HD label class= weui-label 手机/label/Div class= weui-cell _ _ BD span class= weui-input id= mobile /span/Div/Div/Div weui还有一个致命的缺点：多一个span或Div可能会让你的风格完全失效。例如，仅仅在body和tab__hd之间添加一个div就可能导致页面失败。

　　body class=tab _ _ HD/div/div/body and body div div class=tab _ _ HD/div/div/body

（3）Jquery Mobile

　　网址：http://jquerymobile.com/

　　优点：这应该是最早的HTML5框架，

　　缺点：虽然Jquery很受欢迎，但不得不说JqueryMobile是一部失败的作品。好像现在所有的更新都停了。JM最大的缺点是速度慢。

　　难怪，浏览器支持CSS和JS，但JM通过定制大量数据来重写渲染的最终风格-*。

　　比如下面代码的data-enhanced，data-icon，这些data-*属性不被浏览器识别，需要通过JM的JS引擎解释，转换成CSS语言。

　　当页面大量使用这些data-*属性时，性能下降很大，现在应该很少有人用了。

　　input type= button data-enhanced= true value= enhanced-left input type= button data-icon= delete value= left(default)

（4）Bootstrap

　　网址：http://www.bootcss.com/

　　优点：兼容PC和手机，它的理念和风格启发了很多后起之秀，比如把页面分成12份，根据不同分辨率自动组合灯光。在PC风格中有着不可替代的作用。

　　缺点：正是因为他需要兼容PC和手机，所以虽然PC的风格很优秀，但是手机的效果只能说是“中规中矩”。毕竟“想让马跑得快，不吃草”是不现实的。

（5）Framework7

　　网址：http://www.framework7.cn/

　　没用过，但是看起来不错，值得一推。

（6）Amaze UI

　　网址：http://amazeui.org

　　不是，其实Amaze有一个基于React.js的移动Web组件库，http://t.amazeui.org觉得入门门槛挺高的，因为是基于React.js的

（7）Layui

　　网站http://www.layui.com

　　Layer目前很红，但她还是以PC为主。

　　关于几个流行的HTML5 UI框架的对比(总结)这篇文章到此为止。更多相关HTML5 UI框架，请搜索之前的文章或者继续浏览下面的相关文章。希望你以后能支持我！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。