Bootstrap排版中地址与引用详解
地址元素address
我们的地址在HTML5中增加了一个address标签,可以把我们的地址写在address标签里面,address里面强调换行等等都是可以的。
实例:
<address>
<strong>Twitter, Inc.</strong><br>
795 Folsom Ave, Suite 600<br>
San Francisco, CA 94107<br>
<abbr title="Phone">P:</abbr> (123) 456-7890
</address>
<address>
<strong>Full Name</strong><br>
<a href="mailto:#">first.last@example.com</a>
</address>
运行结果:
这是html5增加的这个标签,只是Bootstrap对这个标签里的文字做了简单的样式。我们可以来查看这个样式ctrl+F
引用blockquote
1.引用什么意思呢?
比如我们要引用一篇文章一篇诗词,它会在引用的左边打一道竖线,就表示这个内容是来自于网上或是其它的什么地方。
2.演示操作
<blockquote class="pull-right"> //决定这条线和引用的文本是在左边还是在右边
<p>
Bootstrap是Twitter推出的一个用于前端开发的开源工具包。它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CSS/HTML框架。目前,Bootstrap最新版本为3.0...
</p>
<cite>来自<em>bootstrap中文网</em></cite>
</blockquote>
3.运行效果,因为我们定义的是"pull-right"所以是右对齐的方式,右边会有一道竖线,“来自bootstrap中文网”用斜体来强调了一下。
4.我们也可以用small标签
5.运行效果(字体看上去好像要比之前的小)
6.引用Bootstrap
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
<footer>Someone famous in <cite title="Source Title">Source Title</cite></footer>
</blockquote>