Bulma-基于 Flexbox 的现代化的 CSS 框架
2018-08-21 本文已影响0人
SevDot
我的个人网站是基于 PHP 框架 Laravel 和 CSS 框架 Bulma 开发的，从认识 Bulma 以后我就非常喜欢它了，一直使用，现在推荐出来给大家，希望能为您开发网页样式节省一些时间
我为什么选择 Bulma?
Bulma是一个基于 Flexbox 的现代化的 CSS 框架,其响应式、模块化、开源免费,可以轻松用来实现各种简单或者复杂的内容布局,支持:Chrome、Edge、Firefox、InternetExplorer(10+)、Opera以及Safari等浏览器。
选择 bulma 是基于以下几点：
- 轻量，无依赖。
- 基于 flexbox 布局和使用 rem。
轻量，无依赖。
Bulma 是一个轻量、易用的 CSS 框架，许多 CSS 框架的要么比较大，要么依赖于 Jquery 这样的 JS 库，与我而言，更喜欢轻量、无依赖的，这样方便我更好的搭配组合
基于 flexbox 布局和使用 rem 单位。
Flex 是 Flexible Box 的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性。Rem（font size of the root element）是指相对于根元素的字体大小的单位，宽度自适应，可以完美适配不同宽度的屏幕。
Bulma 还是 Bootstrap ?
Bulma 的作者自己在博客文章中说到他自己也是 Bootstrap 的粉丝，Bulma 是受 Bootstrap 的目标和目的的启发而产生的，对此他做了一个比较供选择不定的人的一些参考。
图片来源于截图
选择 Bulma :
- 更现代化，基于 flexbox 布局和使用 rem 单位
- 简单的栅格系统
- 易于学习
- 支持 Font Awesome 5
- 拥有 100 多个 css 类助手
- 没有 Javascript 依赖
选择 Boostrap:
- 大量 jQuery 插件
- 使用人数多，社区强大
- 对 IE 浏览的兼容性更好
- 有一些 Bulma 的组件，比如 列表组，wells 插图,页眉
学习资源
首推的当然是官方网站 和 Github，其次推荐一些国内的学习资源：
- 阮一峰的教程 - CSS 框架 Bulma 教程
- lqzhgood 翻译的开源中文文档
当然我最近也打算在我的个人网站上翻译和维护一份 Bulma 中文文档，目的很简单，加强记忆和练习英语。
感谢阅读，我是 sevdot，全栈开发工程师和终身学习者。
不喜勿喷，以人为善，比聪明更重要。
欢迎留言和关注，且接受任何宝贵的建议。
了解更多
