Bulma是一个基于 Flexbox 的免费开源 CSS 框架。它组件丰富、兼容且文档齐全。它本质上是高度敏感的。它使用类来实现其设计。
进度条用于显示计算机上进程的进度。进度条显示完成了多少过程以及还剩下多少。
示例 1:此示例使用 Bulma 创建一个简单的进度条。
Bulma Progress bar
Progress bar
输出:
示例 2:此示例创建不同大小的进度条。
Bulma Progress bar
Different sizes Progress bars
Size
Progress bar
Small
Default
Medium
Large
输出:
示例 3:此示例创建不同颜色的进度条。
Bulma Progress bar
Different colors Progress bars
Color
Progress bar
Primary
Link
Info
Success
Warning
Danger
输出:
示例 4:此示例创建不同颜色的不确定进度条。
Bulma Progress bar
indeterminate Progress bars
Color
Progress bar
Primary
Link
Info
Success
Warning
Danger
输出:
说明:不确定进度条用于显示正在进行的某些进度,但尚未确定实际持续时间。未定义 HTML 值属性时,会显示不确定的进度条。
注意:在上面的所有示例中,我们使用了一些额外的 Bulma 类,如容器、列、标题、表格等,以很好地设计内容。