流行的前端框架,提供 HTML、CSS 与 JavaScript 组件,用于构建响应式、移动优先的网站。
- Star
- 50,037
- Fork
- 3,870
- 未关闭 Issue
- 532
- 最近提交
- 上个月
这是什么?
Bulma 是一个基于 Flexbox 的 CSS 框架,最终产物是一份单独的 CSS 文件。可以直接使用,也可以下载 Sass 源码修改变量来自定义样式。支持通过 npm、Yarn、Bower 安装,也可以从 CDN 引入。
Bulma 不包含任何 JavaScript,只负责样式层,因此可以与任何框架搭配使用,交互逻辑由开发者自行实现。浏览器方面主要面向 Chrome、Edge、Firefox、Opera 和 Safari 的较新版本,并通过 autoprefixer 兼容较早版本的 Flexbox;Internet Explorer 10 及以上仅部分支持。
项目周边有大量社区封装和主题,包括 React、Vue、Svelte、Angular、Django、Rails 等框架的集成。
核心功能
- 01基于 Flexbox 的布局体系
- 02以单个 CSS 文件发布,不依赖 JavaScript
- 03可通过 Sass 变量自定义样式
- 04支持 npm、Yarn、Bower 安装或使用 CDN 引入
- 05借助 autoprefixer 提升浏览器兼容性
适用场景
- 不想从零编写 CSS,为静态网站或落地页快速搭建样式
- 为 Django、Rails 等服务端渲染应用统一界面风格
- 基于 Bulma 的 Sass 变量定制自有主题
- 为 React、Vue 等 JavaScript 框架搭配样式层
快速上手
- 1
从 npm 安装 Bulma
npm install bulma - 2
在项目中导入 CSS 文件
@import 'bulma/css/bulma.css'
使用前须知
- Bulma 仅提供 CSS,不包含 JavaScript,交互组件需要你自行实现。
- 对 Internet Explorer 10 及以上版本仅部分支持。
标签
常见问题
- bulma 是什么?
- Bulma 是一个基于 Flexbox 的现代 CSS 框架,提供开箱即用的样式组件与布局类,不含 JavaScript。 Bulma 是一个基于 Flexbox 的 CSS 框架,最终产物是一份单独的 CSS 文件。可以直接使用,也可以下载 Sass 源码修改变量来自定义样式。支持通过 npm、Yarn、Bower 安装,也可以从 CDN 引入。
- bulma 可以免费使用吗?用的什么许可证?
- bulma 以 MIT 许可证开源。用于商业产品前,请先确认许可证条款。
- bulma 还在维护吗?
- 半年内有更新。bulma 最近一次提交是在 2026年9月21日。
- bulma 适合用来做什么?
- 不想从零编写 CSS,为静态网站或落地页快速搭建样式 为 Django、Rails 等服务端渲染应用统一界面风格 基于 Bulma 的 Sass 变量定制自有主题 为 React、Vue 等 JavaScript 框架搭配样式层
- bulma 怎么安装和运行?
- 从 npm 安装 Bulma: npm install bulma 在项目中导入 CSS 文件: @import 'bulma/css/bulma.css'
- 在哪里获取 bulma?
- 源代码和安装说明在 GitHub 上:https://github.com/jgthms/bulma
概要由 AI 根据项目 README 生成;GitHub 数据每日更新。
相关项目
17.5万7.9万MDXMIT更新于 昨天
一个实用类优先的 CSS 框架,通过小而单一用途的类直接在标记中构建自定义界面。
9.8万8392TypeScriptMIT更新于 前天
基于 Bootstrap 5 的免费开源 HTML 后台管理面板 UI 套件,内置页面、组件、暗色模式和 RTL 支持。
4.2万4434AstroMIT更新于 4小时前
一套专业的前端 HTML、CSS 与 JavaScript 起步模板,用于构建快速、健壮且可适配的网站和 Web 应用。
5.8万1.2万JavaScriptMIT更新于 10天前
一个高性能、灵活的 CSS-in-JS 库,支持用字符串或对象编写样式,并可预测地组合样式。
1.8万1137JavaScriptMIT更新于 2个月前
Cal Sans v2 的界面版可变字体,针对高分屏上 14–15px 的界面文字优化。
1748JavaScriptOther更新于 16天前