bootstrap3.0教程之排版详细使用教程(标题、页面主体、强调、缩略

2020-04-27 07:53:15易采站长站整理

引用

在你的文档中引用其他来源的内容。

默认样式的引用

将任何裹在之中即可表现为引用。对于直接引用,我们建议用标签。裹在之中即可表现为引用。对于直接引用,我们建议用标签。

复制代码
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
</blockquote>

引用选项

对于标准样式的

<blockquote>
,可以通过几个简单的变体就能改变风格和内容。

命名来源:添加

<small>
标签来注明引用来源。来源名称可以放在
<cite>
标签里面。

复制代码
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
<small>Someone famous in <cite title=”Source Title”>Source Title</cite></small>
</blockquote>

会多一个Source Title

另一种展示风格

使用

.pull-right
可以让引用展现出向右侧移动、对齐的效果。

复制代码
<blockquote class=”pull-right”>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
</blockquote>

向右对齐移动了额,当然也有相应的pull-left。

列表

无序列表

顺序无关紧要的一列元素。

复制代码
<ul>
<li>Lorem ipsum dolor sit amet</li>
<li>Lorem ipsum dolor sit amet</li>
<li>Lorem ipsum dolor sit amet</li>
<li>Lorem ipsum dolor sit amet</li>
<li>Lorem ipsum dolor sit amet</li>
</ul>

这个也很明显和Html的一样。

有序列表

顺序至关重要的一组元素。

复制代码
<ol>
<li>Lorem ipsum dolor sit amet</li>
<li>Lorem ipsum dolor sit amet</li>
<li>Lorem ipsum dolor sit amet</li>
<li>Lorem ipsum dolor sit amet</li>
<li>Lorem ipsum dolor sit amet</li>
</ol>

同理有序列表。

无样式列表

移除了默认的

list-style
样式和左侧外边距的一组元素(只针对直接子元素)。