Repolode
jgthms

jgthms/bulma

Bulma 是一个基于 Flexbox 的现代 CSS 框架,提供开箱即用的样式组件与布局类,不含 JavaScript。

可替代:BootstrapTailwind CSS

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. 1

    从 npm 安装 Bulma

    npm install bulma
  2. 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 数据每日更新。

相关项目