Bootstrap CSS 排版参考
Bootstrap 的默认设置
Bootstrap 的全局默认字体大小为 14px,行高为 1.428。
这适用于 <body> 和所有段落。
此外,所有 <p> 元素的底部边距等于其计算行高的一半(默认情况下为 10px)。
排版
下面的元素将比浏览器默认样式具有略微不同的样式。查看“尝试一下”示例以查看结果/差异。
下面的类用于进一步设置元素的样式。
元素/类 | 描述 | 示例 |
---|---|---|
<h1> - <h6> 或 .h1 - .h6 |
h1 - h6 标题 | 试一试 |
<small> | 在任何标题中创建较浅、次要的文本标题 (次要文本) |
试一试 |
.small | 表示较小的文本(设置为父大小的 85%):较小文本 | 试一试 |
.lead | 使文本脱颖而出:醒目的文本 | 试一试 |
<mark> 或 .mark |
突出显示文本:高亮文本 | 试一试 |
<del> | 表示已删除的文本: |
试一试 |
<s> | 表示不再相关的文本: |
试一试 |
<ins> | 表示已插入的文本:已插入文本 | 试一试 |
<u> | 表示下划线文本:下划线文本 | 试一试 |
<strong> | 表示粗体文本:粗体文本 | 试一试 |
<em> | 表示斜体文本:斜体文本 | 试一试 |
.text-left | 表示左对齐文本 | 试一试 |
.text-center | 表示居中文本 | 试一试 |
.text-right | 表示右对齐文本 | 试一试 |
.text-justify | 表示两端对齐文本 | 试一试 |
.text-nowrap | 表示不换行文本 | 试一试 |
.text-lowercase | 表示小写文本:小写文本 | 试一试 |
.text-uppercase | 表示大写文本:大写文本 | 试一试 |
.text-capitalize | 表示首字母大写文本:首字母大写文本 | 试一试 |
<abbr> | <abbr> 元素表示缩写或首字母缩略词。带有 title 属性的缩写在悬停时显示虚线下边框和帮助光标,在悬停时提供额外上下文。 | 试一试 |
.initialism | 以略小的字体大小显示 <abbr> 元素中的文本 | 试一试 |
<address> | 展示联系信息 | 试一试 |
<blockquote> | 表示来自另一来源的内容块 | 试一试 |
.blockquote-reverse | 表示右对齐内容的块引用 | 试一试 |
<ul> | 表示无序列表 | 试一试 |
<ol> | 表示有序列表 | 试一试 |
.list-unstyled | 删除列表项的默认列表样式和左边距(适用于 <ul> 和 <ol>)。此类仅适用于直接子列表项(要删除任何嵌套列表的默认列表样式,请将此类也应用于任何嵌套列表) | 试一试 |
.list-inline | 将所有列表项放在单行上 | 试一试 |
<dl> | 表示描述列表 | 试一试 |
.dl-horizontal | 将 <dl> 元素中的术语和描述并排放置。它开始时就像默认的 <dl>,但在浏览器窗口展开时,它们会并排放置 | 试一试 |
代码
元素/类 | 描述 | 示例 |
---|---|---|
<var> | 表示变量:x = ab + y | 试一试 |
<kbd> | 表示通常通过键盘输入的输入:CTRL + P | 试一试 |
<pre> | 表示多行代码 | 试一试 |
<pre class="pre-scrollable"> | 带滚动条的多行代码 | 试一试 |
<samp> | 表示计算机程序的示例输出:示例输出 | 试一试 |
<code> | 表示内联代码片段:span , div |
试一试 |