Bootstrap10那个H5前端框架

当同样叫作做啊于前者死缠烂打6年同时懒到不行的攻城士,这几年我或阅过很多同门从知名到好有名的各种前端框架,本来想拿15-20独框架来享受一下,但在跟几个长辈讨教写篇的技能时坚决被无情之打击了,所以这里自己要么低调的单纯拿出10个框架来个深锅乱烧来大概介绍,凑够字数为即全重终了。

原本写这篇稿子纪念围绕着 CSS 框架来的,但以目前界内比较盛行并遍地开花的重大还是 JS+CSS 模式的框架,并且自己靠着同样沾 JS 功底,就想特别针对 CSS,所以最终来单大锅乱烧都约聊聊。下面的框架为不曾呀先后顺序之分,我想开什么就描写什么啊( 作为前端,我从来都如此的随意 ^_^ )。

Bootstrap

先是说 Bootstrap,估计您吗猜到会先说或者自然会产生此( 呵呵了
),这是认证其的强劲的远在,拥有框架一壁江山的势气。自己刚刚入道的时节针对代码任何一个字母都得温馨敲出来挡我者废的决心,来让自己成长。结果遭遇周围各种基友的诱使开始了
Bootstrap
旅程。本人虽然是只计划+前端的万里出同一之丰姿,但是天空就受我会见就此 PS
和各种设计工具却不被自家同设计妹子一样的审美,所以这也是自早期选择
Bootstrap
的缘故之一,它吃自己开出来的物好歹能在妹妹面前装个逼,不过时间增长了不免觉得
Bootstrap 美的受人烦恼,
但好以它的每个版本都见面发生酷非常之改变,不见面让人当温馨做的网站会以及多网站逢脸。Bootstrap
的用法及其简单( 这为可能就是 Bootstrap
作者阅攻城士无数,了解他们痛之结果
),以至于是单稍前端都好快达标亲手,几乎没什么学习成本。

官网:http://getbootstrap.com/

Github:https://github.com/twbs/bootstrap/

作者:Mark Otto 和Jacob Thornton Star:93,112

总:Bootstrap
最可怜的优势就是是它可怜流行,流行就象征你有题目便发出成百上千口帮扶您解决问题,就表示装逼它就是利器,还有就是是界面比较和谐,容易上手,关注它的童鞋应该发现时
V4 版也初步支持 FlexBox 布局,这是老大好之升官经验。 劣势是 class
命名不够语义化,并且各种缩写,以至于我离开矣文档就是单菜,最近初始整治混合
APP,选框架的上首选就是其,但前面来 PC
一直无留神,后来施行混合右键属性看它的时节,瞬间一阵凉风袭来,Bootstrap
好小,小到自家不得不选择别的框架。

AUI

其三只凡是新近恰巧兴起的AUI,虽然作者声称是专为APICloud开发者设计之一模一样仿UI框架,但事实上它还是解决了许多运动前端开发的广阔问题,是生死攸关面向混合开发的
CSS 框架。看起作者比较放肆,各种高级 CSS3
遍地使用,这吃自己吗不得不去查这些个 CSS3
的兼容性。不指众望果然选的还是匹配对的性能,哈哈了千篇一律抛锚激动打前辈手上大胆认识了几乎单好东西,并且框架还提供了聊天界面、计数列表等零件,解决了好多犬牙交错的为我骂娘的布局,现在可直接以走便用。

Github:https://github.com/liulangnan/aui

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

作者:流浪男 Star:92

小结:这个框架对自吧出个亮点就是是纯 CSS 框架,自己以前为就算因此了
Pure,自己有点 JS 能力,如果无是错综复杂的效果,找个纯 CSS
框架自己无改改就好,而今天 CSS3
也曾会成功动画,效率、质量、高效全兼顾,所以还是选择了这种 CSS
框架。有一些以为遗憾的凡及时框架的文档真的好那什么,说好的远大上为。

Amaze UI

其次单介绍的凡妹子UI,最初使用她是为本尊遇到了一个爱纠结细节设计士,有同不好她同我的书体较上确了,结果同样句子顶万句子之
BOOS 夸了其,我只能根据它们底想法去化解,结果最后找到了Amaze UI 框架(
我非在意你给我懒淫 ),按照合法的口舌说不怕是
“基于社区开源项目构建的一个跨屏前端框架,以移动优先,从小屏到大屏,最终兑现所有屏幕适配,适应移动互联潮流”
。但事实上我就算看遭到其亦可解决国内浏览器存在的跨屏适配和兼容性问题。

官网:http://amazeui.org/

Github:https://github.com/amazeui/amazeui

所属公司:云适配 Star:6710

总结:Amaze UI 总的来说就是投入更多副中国市面特点的素,框架对跨屏、适配都举行了的较好的处理又准备等同了同文山会海的常用的网页组件,为削减整治兼容、适配各种敲键盘的加班狗们的劳作时召开了非聊之奉献。,框架还针对汉语排版优化,兼容中国故里主流浏览器、轻量化,不仅适用于桌面端,还又重适合移动端、包含有包裹好的Widgets。不过起为尽管我备感 Amaze UI 文档是否发接触最那什么了,比如 “人们切莫会见于乎jQuery的那么点流量。”,说实的当即时的确没有啥,不过我从未会说出( 哈哈 ),代码和计划性及发并未太多突出的触及。

Frozen UI

出段时看到 QQ 瞬间巨大上了,后来到处打探,原来 QQ 客服端也因此了
混合开发,其中QQ会员前端用底凡 Frozen
UI,并且就套框架开源,欣喜若狂耐不停止内心的寂寞直接上手试了一致全,初体验感觉基础样式效果简单色调清爽,有个比较活跃的社区所以组件什么的啊比较丰富。

Github:https://github.com/frozenui/frozenui

官网:http://frozenui.github.io/

作者: QQVIP FD Team Star:1,067

总结:如果以 Frozen UI 配合局部假如 APICloud 用来开混合 APP
感觉就是太要命了,或者原生的火鸡们将去嵌套在采用被举行前端开发,这个框架对
android 2.3 +、ios 4.0 + 做了配合,或者以来举行 Web App
也是无与伦比好之精选,劣势的语从 UI
层面就可以看到了,谁让她是出生在QQ会员前端的啊。

Frozen UI

老三独是Frozen UI,有段时间来看 QQ 瞬间巨大上了,后来四处打听,原来 QQ 客服端也因而了 HTML 混合开发,其中QQ会员前端就是之所以之 Frozen UI,并且这套框架开源,欣喜若狂耐不停止心中的落寞直接上亲手三下五除二试了千篇一律通就是起来试用,初体验的就算是基础样式效果简单色调清爽,有个比较活跃的社区所以组件什么的也比较丰富。

Github:https://github.com/frozenui/frozenui

官网:http://frozenui.github.io/

作者: QQVIP FD Team Star:1,067

小结:如果将 Frozen UI 配合局部比方 APICloud 用来做混合 APP 感觉就最特别了,或者原生的火鸡们拿去嵌套在用中做前端开发,并且是框架对 android 2.3 +、ios 4.0 + 做了相当,或者用来开 Web app 也是最好好的挑选,不过若是放在微信里比较马上再适用的 WeUI 框架进一步首选了,劣势的言语从 UI 层面就可以看到了,谁被其是落地在QQ会员前端的吧。

WeUIi

季只是WeUI和与 FrozenUI都属 差不多的 WeUi了,也是一个较专一的框架,WeUI应该说比较FrozenUI前者更把一,话说连个官网还非整,所有对都当 gitHub Issues 解决了,这个框架极其简约,体积当然就无须说了,模块也就算 7 个左右,不过体量虽然有些开的可是,口碑看 star 就足足了,框架从 16/1/23 发版至今 github star 超过 7K,不过呢不免除用户并未地方发泄所以都飞至 git 上来,哈哈。

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

DEMO:http://weui.github.io/weui/

Star:7,129

小结:看了微信设计团队设计之当即套 DEMO,二话不说如果假定开微信公众,这个二话不说必然是首选了。框架不好的地方简而言之即是框架本身应当就从未考虑了吃用户以非微信的场景之下。

SUI

“SUI 是一律仿照基于bootstrap开发的前端组件库,同时其她也是平等学设计规范。通过SUI,可以十分有利于之规划以及贯彻好的页面”。 果然还是一直引用官方给的枯燥无味广告而省自己的脑细胞( 囧… ),当然矣不畏像广告说的,如果您前面用了 Bootstrap, 那么好轻松转向 SUI,这或者就是淘宝为前端屌丝们的便利了。。 

Github:https://github.com/sdc-alibaba/sui

官网:http://sui.taobao.org/sui/docs/index.html

Star:120

AUI

第六独是近期正好起的近年刚好兴起的 AUI,虽然作者声称是占据为APICloud开发者设计的相同学UI框架,但实际它要解决了广大动前端开发的宽广问题,是她至关重要面向混合开发之 CSS 框架。,所以看起作者比较猖獗,各种高档 CSS3 遍地使用,这也令自己只得去检查这些个 CSS3 的兼容性。不因众望果然选的且是相当对的性质,哈哈了相同间断激动自前辈手上大胆认识了几乎独好东西,并且框架还提供了聊天界面、计数列表等零件,解决了多扑朔迷离的叫自家骂娘的布局,现在可以直接拿走就是就此。

Github:https://github.com/liulangnan/aui

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

作者:流浪男 Star:92

总:这个框架对本人的话有只优点就是是纯 CSS 框架,自己先也尽管就此过 Pure,自己有点 js 能力,如果未是错综复杂的效应好找个纯 CSS 框架自己管改改就能达标效果,而现在 CSS3 也早就能够不辱使命各种卡通,效率、质量、高效各种一刹车考虑用还是选择了这种 CSS 框架。而直接看遗憾的凡立即框架的文档真的好那什么,说好的高大上吗。

MUI

曾一直使用 Android 系统的本身,后来来看 IOS,果断移情别恋了,不亮干什么苹果每次调整系统本身还专门喜,后来一段时间因为缺设计自己特意模仿 IOS 系统做 UI,但总未可知就死好,无意间就意识了 MUI 这个框架,这个框架让自家的吸引的处在便是她的 UI 是以 IOS 为主导设计的,当然她也加了android特有UI样式。并且MUI官方声称用来支付深入下发现以它做 APP 还能够提高用户以流畅度,然后就尝试着重新透之询问以及采取一段时间。

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

Github:https://github.com/dcloudio/mui

Star:2,450

小结:就如之前说之之框架是因零星生系统为参考来封装UI组件,框架自身还有一个较活跃的社区,不绝好之地方就为是我特别关爱之某些,关于开发使用的流畅度,我自然知道这是 H5 目前底劣势,但是看到官网被的描述,还是得在希望的思想试试看可不可以升迁,然而它们事实上还是亟需是指 Webview来提升,而未是框架本身。

Semantic UI

倒数第三只凡是 Semantic UI,接触者框架或因 Bootstrap,Semantic UI
刚上线 github
就中大量开发者的关切,以至于许多总人口用其俩相比各种挑刺各种称赞,是好是深不克但凭别人三句四句子就抬起指头开始赞叹,用了随后感到
UI 上以及 Bootstrap 没太多的区分,不过代码命名规范及可去大大,本人看
Semantic UI
是休是就想做的免一致,它的命名全是使用复合的法门,类名特别之离散,用的时你得格外小心自己壮大或者新增的
class 命名与它们的类名冲突。

官网:http://www.semantic-ui.cn/

Github:https://github.com/semantic-org/semantic-ui/

 Foundation

Foundation
算是框架界的长者啦,都说框架去的早,而此框架一直到现在依然这样的俏,如果你比较介意
Bootstrap 开发遇到脸的两难事情,那么你可以设想使用 Foundation
。即使你利用预定义的 UI 元素,
也不见面跟其余网站极度像,就比如官说之给开发者重新活的框架体验。

官网:http://foundation.zurb.com/

Github:https://github.com/zurb/foundation-sites

Star:22,736

UiKit

UIkit是YOOtheme团队开支之,在成千上万WordPress主题中还出使(也即是只要您是独
WordPress
爱好者,那么这框架应该比较适合深究),并且框架能够通过GUI编辑器和手动编辑,所以其提供了一个心灵手巧、强大的自定义机制。框架借助LESS、jQuery、normalize.css及FontAwesome开源项目的独有特色,整合成了这样一悠悠轻量级、模块化的前端框架。

官网:http://www.getuikit.com/
Github:https://github.com/uikit/uikit
作者:YOOtheme Star:6,372

Pure

终最终一个了,我和您同样好开森
(~ ̄▽ ̄)~),这个框架是自以举行管理体系时常点的,选择采取啊是因框架小巧,并且是纯
CSS,没有最好多之拖累,好用来与任何框架迅速组合使用。

官网:http://purecss.io/

Github:https://github.com/yahoo/pure/

Star:13,592

介绍了,估计您该看出来了,我以框架真的也便是赶上了急需,才选择了某个框架,所以框架内并没有啊好及特好之分,只能说若的求是什么,这个框架合适不相宜你错过用,各种框架用起为还约差不多,会用一个别的左侧也就算都易得简单容易上手,我以为能够写框架的丁犹是露天高仁。

 

相关文章