2.1.4 地址样式

Bootstrap中可以通过<address>标签来添加地址（邮箱地址等），读者也可以用它来为网页添加联系信息。并且在Bootstrap中，<address>清除了斜体样式，设置了底部的外边距为1rem，默认其显示方式display为block，所以读者需要用<br>标签来使封闭的地址文本换行。例如，图2-13所示就是Bootstrap中地址的表现样式。

地址样式

图2-13　Bootstrap中的地址样式

【例2-10】使用Bootstrap制作明日学院的联系方式页面。具体代码如下：

<style type="text/css">
   .bg{
      background: url("images/12.png") ;        /*自定义背景样式*/
   }
</style>
<div class="bg text-center">
   <img src="images/3.png" alt=""><br>
   <img src="images/10.jpg" alt="" width="150" class="mt-5">
<address class="mt-3 pb-5 mb-0">    <!--mt-3，pb-5，mb-0分别设置上外边距为1rem、上内边距为3rem、底部外边距为0rem-->
   客服热线：400675****<br><br>
   邮箱地址：mingrisoft@******<br><br>
</address>
</div>

上述代码的运行效果如图2-14所示。

图2-14　明日学院的联系方式页面