amaze ui和bootstrap有哪些差别？

amaze ui和bootstrap有哪些差别？

问题

我最近在学amaze ui，感觉如果单从功能性来看和bootstrap最大差别也就是扁平化，不过妹子ui号称对国产本土化支持更好，这个具体表现在哪？看他官方文档倒是挺逗趣的。。。然后栅格布局好像比bootstrap要灵活一些。其他的求补充

 

解答

字体设置比较 ok，勉强再加上个盒模型比较省心，除此以外就是山寨 Bootstrap + 各种本土网站插件。

本来你让我黑它我是拒绝的，毕竟是国人项目，起初我还是很滋瓷的，但是后来越营销越臭，恶趣味 Star 不说，就是恶趣味 Star 也比不过 Gogs，为什么我要扯出一个与前端毫无相关的项目呢，因为他们营销的时候，从来都是以「国人项目」为噱头，但是他们给出的排名也好增幅也罢，从来就没有 Gogs 的踪影，从头到脚都是满满的铜臭味。

还整天管自己叫妹子 UI 妹子 UI 的，麻烦雇个好点的文案组织一下语句好不好，全身散发着一股抠脚大汉味，抠脚大汉 UI 你好，抠脚大汉 UI 再见：）

要轻巧有 Pure，要强大有 Semantic UI，要中规中矩有 Bootstrap，真没必要去抠脚，真没必要~

供从我的观点进行对比:

对比人背景:

1. 了解一些HTML和CSS基础, 但是如果需要自己写一个各种效果的页面的话. 累觉不爱.
2. 无美工基础, 最好有比较现成的配色方案, 字体大小方案. 看得过去, 拿来能用.
3. 前后端,运维,产品经理,设计UI都是自己一个人.没有精力和能力去为不同的终端屏幕尺寸定制不同的页面.

bootstrap和amazeUI比较重要的区别:

1. bootstrap文件体积比amazeUI小很多
2. bootstrap中文文档写得好, 通俗易懂. 用得人多, 优秀案例多, 前面填坑的人多. 网上各种教程插件多, 遇到问题更容易搜索到解决方案一些.
3. bootstrap的傻瓜式定制要比amazeUI全一些,强一些.
4. amazeUI的默认界面更扁平化一些, bootstrap的默认样式现在看起来有点审美疲劳了. 特别是导航条, 分页按钮之类的.(要自己去改导航条的样式, 我感觉好难). 总之感觉amazeUI默认样式更漂亮一些(周星驰: 艺术这个东西是很主观滴~). 不过! 不过为什么amazeUI的示例文档感觉那么的丑. 官网好看多了. 哎, 同样的工具在不同的人手里, 差别好大. bootstrap的示例页面好看多了.
5. bootstrap是标准盒模型, 为一个元素设置了尺寸, 它实际影响的范围要去计算padding,border,margin. 而amazeUI貌似是自己定义的盒模型, 为一个元素定义了尺寸之后, 即定下了元素内容, 以及padding, border的总尺寸. 唯一要考虑的只是元素的margin. 感觉amazeUI这种更直观, 更方便使用在响应式中. 不再去担心自己算术不好. 一个元素有无padding, border只会挤压它自己的内容. 元素这个整体的尺寸不变. 更像一个盒子一些.

bootstrap和amazeUI零碎的区别:

1. bootstrap的h1~h6字号比较合理, 方便使用. 并且可以傻瓜式定制. amazeUI只有h1和h2分别是24px和20px, 其它全部是14px.
2. amazeUI的基准字号是16px, 而且将浏览器的基准字号设置为 62.5%，也就是 10px，现在 1rem = 10px, 在自定义字体大小的时候, 比较方便计算.比如36px就是3.6rem.
3. amazeUI字体针对中文优化. 不过bootstrap支持定制. 貌似就是改一句font-family的事.
4. 据说bootstrap用的图标是Glyphicons, amazeUI用的是更好的Font Awesome, 不知道对我来说区别有多大. 好像没有蛮大区别. 反正也不用.
5. amezeUI默认有方便的动画. bootstrap没有.
6. bootstrap有现成的媒体对象. 左图右文. amazeUI没有.
7. amazeUI自带OffCanvas侧边栏, 在移动端侧边划出菜单. 效果可以做得不错. bootstrap貌似要自己解决.

我的选择:

由于文档对初学者的友好程度以及从网上找到解决方案的容易程度. 不得已, 只能选择bootstrap.

比如导航条, bootstrap会给出哪个一类控制哪些功能, 而amazeUI只是展示了一个代码段的案例. 如果前端比较熟悉的, 应该没有任何问题, 但对于我这种新手来说, 真的无从下手.

关于改变bootstrap或amazeUI的默认样式, 可以在chrome开发者工具里面, 定位到元素, 查看哪些css样式影响了自己需要的效果(chrome可以直接在浏览器中启用或停用样式). 找到相关的元素和样式后, 可以加自己的class, 覆盖默认的样式.

对于前端而言都差不多，都可以开发出不错的页面来。以前H4的年代大部分是自己写css，现在都是套用amaze或者bootstrap，比自己写省事多了。
如果你是前端新手，建议你先用amaze，毕竟是国产的东西，文档比翻译过来的更容易理解一些。主要是他有webstorm和sublime插件片段，借助这些片段可以很好的写出页面来。
如果你是前端老手，建议你用bootstrap，国际化的东西无需多言，比amaze用的人多一些，不管是国内的还是国外的。
本人在学习之前也是比较了比较，就是因为amaze的文档和webstorm插件才放弃了bootstrap。。