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>

BootstrapTwitter推出的一个用于前端开发的开源工具包。它由Twitter的设计师Mark OttoJacob 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>

 

原文链接:http://www.maiziedu.com/wiki/bootstrap/address/

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值