一.Bootstrap 中定义了所有的 HTML 标题（h1 到 h6）的样式。
<!DOCTYPE html> <html> <head> <title>Bootstrap 实例 - 标题</title> <link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <script src="/scripts/jquery.min.js"></script> <script src="/bootstrap/js/bootstrap.min.js"></script> </head> <body> <h1>我是标题1 h1</h1> <h2>我是标题2 h2</h2> <h3>我是标题3 h3</h3> <h4>我是标题4 h4</h4> <h5>我是标题5 h5</h5> <h6>我是标题6 h6</h6> </body> </html>效果： 二.内联子标题<small> <h1>我是标题1 h1. <small>我是副标题1 h1</small></h1> <h2>我是标题2 h2. <small>我是副标题2 h2</small></h2>效果图： <h1>我是标题1 h1. <small>我是副标题1 h1</small></h1> <h2>我是标题2 h2. <small>我是副标题2 h2</small></h2>三.引导主题副本class=“lead”<h2>引导主体副本</h2><p class="lead">这是一个演示引导主体副本用法的实例。</p>
效果图：
四、默认强调标签<strong>粗体文本、<em>斜体文本
<small>本行内容是在标签内</small><br> <strong>本行内容是在标签内</strong><br> <em>本行内容是在标签内，并呈现为斜体</em><br> <p class="text-left">向左对齐文本</p> <p class="text-center">居中对齐文本</p> <p class="text-right">向右对齐文本</p> <p class="text-muted">本行内容是减弱的</p> <p class="text-primary">本行内容带有一个 primary class</p> <p class="text-success">本行内容带有一个 success class</p> <p class="text-info">本行内容带有一个 info class</p> <p class="text-warning">本行内容带有一个 warning class</p> <p class="text-danger">本行内容带有一个 danger class</p>效果图： 五、缩写<abbr title=" "> <abbr title="World Wide Web">WWW</abbr><br> <abbr title="Real Simple Syndication" class="initialism">RSS</abbr>效果图：
六、地址<address>
<address> <strong>Some Company, Inc.</strong><br> 007 street<br> Some City, State XXXXX<br> <abbr title="Phone">P:</abbr> (123) 456-7890 </address> <address> <strong>Full Name</strong><br> <a href="mailto:#">mailto@somedomain.com</a> </address>效果图：
七、引用<blockquote>
<blockquote><p>这是一个默认的引用实例。</p></blockquote><blockquote>这是一个带有源标题的引用。<small>Someone famous in <cite title="Source Title">Source Title</cite></small></blockquote><blockquote class="pull-right">
这是一个向右对齐的引用。
<small>Someone famous in <cite title="Source Title">Source Title</cite></small>
</blockquote>
效果图：
八、列表：Bootstrap 支持有序列表、无序列表和定义列表。
<h4>有序列表</h4><ol> <li>Item 1</li> <li>Item 2</li></ol><h4>无序列表</h4><ul> <li>Item 1</li> <li>Item 2</li></ul><h4>未定义样式列表</h4><ul class="list-unstyled"> <li>Item 1</li> <li>Item 2</li></ul><h4>内联列表</h4><ul class="list-inline"> <li>Item 1</li> <li>Item 2</li></ul><h4>定义列表</h4><dl> <dt>Description 1</dt> <dd>Item 1</dd> <dt>Description 2</dt> <dd>Item 2</dd></dl><h4>水平的定义列表</h4><dl class="dl-horizontal"> <dt>Description 1</dt> <dd>Item 1</dd> <dt>Description 2</dt> <dd>Item 2</dd></dl>
效果图：
九、总结更多排版类 类描述实例.lead使段落突出显示尝试一下.small设定小文本 (设置为父文本的 85% 大小)尝试一下.text-left设定文本左对齐尝试一下.text-center设定文本居中对齐尝试一下.text-right设定文本右对齐尝试一下.text-justify设定文本对齐,段落中超出屏幕部分文字自动换行尝试一下.text-nowrap段落中超出屏幕部分不换行尝试一下.text-lowercase设定文本小写尝试一下.text-uppercase设定文本大写尝试一下.text-capitalize设定单词首字母大写尝试一下.initialism显示在 <abbr> 元素中的文本以小号字体展示尝试一下.blockquote-reverse设定引用右对齐尝试一下.list-unstyled移除默认的列表样式，列表项中左对齐 ( <ul> 和 <ol> 中)。 这个类仅适用于直接子列表项 (如果需要移除嵌套的列表项，你需要在嵌套的列表中使用该样式)尝试一下.list-inline将所有列表项放置同一行尝试一下.dl-horizontal该类设置了浮动和偏移，应用于 <dl> 元素和 <dt> 元素中，具体实现可以查看实例尝试一下.pre-scrollable使 <pre> 元素可滚动 scrollable转载于:https://www.cnblogs.com/937522zy/p/4566184.html
