Bulma 字体真棒容器

介绍

Bulma 是一个基于 CSS 的现代化开源框架，它强调简洁、可读性和响应式设计。其中的字体和容器是 Bulma 的核心组件，能够让程序员快速搭建出漂亮、合适的页面。

字体

Bulma 提供了一套清晰、易读的字体库，其中包含多达 8 种字体，每种字体都有自己的特点和用途，可根据实际情况进行选择。

根据官方文档，Bulma 提供的字体清单如下：

• family-sans-serif：无衬线字体，适合页面正文；
• family-monospace：等宽字体，适合代码展示；
• family-primary：主要字体，适合标题和重要文本；
• family-secondary：次要字体，适合副标题和弱调文本；
• family-code：代码字体，适合代码展示；
• family-title：超大标题字体，适合强调；
• family-heading：标题字体，可用于文章的章节标题；
• family-subtitle：副标题字体，可用于文章的小标题。

Bulma 提供了多达 8 种字体库，每种字体都有自己的特点和用途。

- family-sans-serif：无衬线字体，适合页面正文；
- family-monospace：等宽字体，适合代码展示；
- family-primary：主要字体，适合标题和重要文本；
- family-secondary：次要字体，适合副标题和弱调文本；
- family-code：代码字体，适合代码展示；
- family-title：超大标题字体，适合强调；
- family-heading：标题字体，可用于文章的章节标题；
- family-subtitle：副标题字体，可用于文章的小标题。

容器

Bulma 提供了多种样式的容器，常用的有四种：container、container-fluid、container-pb-desktop 和 container-widescreen。其中，container 是默认容器样式，用于在固定宽度内展示页面内容；container-fluid 则是全屏容器样式，用于在全屏宽度内展示页面内容。

除此之外，container-pb-desktop 和 container-widescreen 则是根据屏幕尺寸而定的容器样式。前者应用于桌面屏幕，后者应用于宽屏幕，可有效优化不同屏幕下的页面展示效果。

Bulma 提供了多种样式的容器，常用的有四种：

- container：默认容器样式，用于在固定宽度内展示页面内容；
- container-fluid：全屏容器样式，用于在全屏宽度内展示页面内容；
- container-pb-desktop：应用于桌面屏幕的容器样式；
- container-widescreen：应用于宽屏幕的容器样式。