Menu
×
   ❮     
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY EXCEL XML DJANGO NUMPY PANDAS NODEJS R TYPESCRIPT ANGULAR GIT POSTGRESQL MONGODB ASP AI GO KOTLIN SASS VUE DSA GEN AI SCIPY AWS CYBERSECURITY DATA SCIENCE
     ❯   

Bootstrap CSS 排版参考


Bootstrap 的默认设置

Bootstrap 的全局默认字体大小为 14px,行高为 1.428。

这应用于 <body> 和所有段落。

此外,所有 <p> 元素的底部边距等于其计算行高的一半(默认情况下为 10px)。


排版

下面的元素是 HTML 元素,它们在 Bootstrap 中的样式与浏览器默认样式略有不同。查看“试用”示例以查看结果/差异。

下面的类用于进一步样式化元素。

元素/类 描述 示例
<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> The <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 试用

×

Contact Sales

If you want to use W3Schools services as an educational institution, team or enterprise, send us an e-mail:
[email protected]

Report Error

If you want to report an error, or if you want to make a suggestion, send us an e-mail:
[email protected]

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Copyright 1999-2024 by Refsnes Data. All Rights Reserved. W3Schools is Powered by W3.CSS.