Bootstrap 4 文本/排版
Bootstrap 4 默认设置
Bootstrap 4 使用默认的 font-size 16px，其 line-height 为 1.5。
默认的 font-family 是 "Helvetica Neue", Helvetica, Arial, sans-serif。
此外，所有 <p> 元素都具有 margin-top: 0 和 margin-bottom: 1rem（默认 16px）。
<h1> - <h6>
Bootstrap 4 使用更粗的字重和更大的字号样式化 HTML 标题（<h1> 到 <h6>）
示例
h1 Bootstrap 标题 (2.5rem = 40px)
h2 Bootstrap 标题 (2rem = 32px)
h3 Bootstrap 标题 (1.75rem = 28px)
h4 Bootstrap 标题 (1.5rem = 24px)
h5 Bootstrap 标题 (1.25rem = 20px)
h6 Bootstrap 标题 (1rem = 16px)
显示标题
显示标题用于比普通标题更突出（更大的字号和更轻的字重），有四个类可供选择：.display-1、.display-2、.display-3、.display-4
<small>
在 Bootstrap 4 中，HTML <small> 元素用于在任何标题中创建更浅的辅助文本
<mark>
Bootstrap 4 将使用黄色背景颜色和一些填充来样式化 HTML <mark> 元素
<abbr>
Bootstrap 4 将使用虚线底部边框样式化 HTML <abbr> 元素
<blockquote>
当引用来自其他源的内容块时，将 .blockquote 类添加到 <blockquote>
示例
50 年来，世界自然基金会 (WWF) 一直在保护自然的未来。作为全球领先的环保组织，WWF 在 100 个国家开展工作，并得到美国 120 万会员和全球近 500 万会员的支持。
<dl>
Bootstrap 4 将以下列方式样式化 HTML <dl> 元素
<code>
Bootstrap 4 将以下列方式样式化 HTML <code> 元素
<kbd>
Bootstrap 4 将以下列方式样式化 HTML <kbd> 元素
<pre>
Bootstrap 4 将以下列方式样式化 HTML <pre> 元素
更多排版类
以下 Bootstrap 4 类可以进一步添加到样式 HTML 元素
| 类 | 描述 | 示例 |
|---|---|---|
.font-weight-bold |
粗体文本 | 试一试 |
.font-weight-bolder |
更粗的文本 | 试一试 |
.font-italic |
斜体文本 | 试一试 |
.font-weight-light |
细体文本 | 试一试 |
.font-weight-lighter |
更细的文本 | 试一试 |
.font-weight-normal |
普通文本 | 试一试 |
.lead |
使段落脱颖而出 | 试一试 |
.small |
表示较小的文本（设置为父级大小的 80%） | 试一试 |
.text-left |
表示左对齐文本 | 试一试 |
.text-*-left |
表示在小、中、大或特大屏幕上左对齐文本 | 试一试 |
.text-break |
防止长文本破坏布局 | 试一试 |
.text-center |
表示居中文本 | 试一试 |
.text-*-center |
表示在小、中、大或特大屏幕上居中对齐文本 | 试一试 |
.text-decoration-none |
移除链接的下划线 | 试一试 |
.text-right |
表示右对齐文本 | 试一试 |
.text-*-right |
表示在小、中、大或特大屏幕上右对齐文本 | 试一试 |
.text-justify |
表示两端对齐文本 | 试一试 |
.text-monospace |
等宽文本 | 试一试 |
.text-nowrap |
表示不换行文本 | 试一试 |
.text-lowercase |
表示小写文本 | 试一试 |
.text-reset |
重置文本或链接的颜色（继承自父元素的颜色） | 试一试 |
.text-uppercase |
表示大写文本 | 试一试 |
.text-capitalize |
表示大写文本 | 试一试 |
.initialism |
在 <abbr> 元素内显示文本，字体大小稍小 |
试一试 |
.list-unstyled |
移除列表项的默认列表样式和左外边距（适用于 <ul> 和 <ol>）。此类仅适用于直接子列表项（要移除嵌套列表的默认列表样式，也需将此类应用于任何嵌套列表） |
试一试 |
.list-inline |
将所有列表项放在一行上（与每个 <li> 元素的 .list-inline-item 一起使用） |
试一试 |
.pre-scrollable |
使 <pre> 元素可滚动 |
试一试 |
完整的 Bootstrap 4 CSS 参考
有关 Bootstrap 4 中所有可用 CSS 类的完整参考，请访问我们的 Bootstrap 4 所有类参考。
