三种图像样式

分别为圆角、圆形、缩略图（带边框）

<img src="/images/me.jpg" class="img-rounded" alt="Rounded Image">
<img src="/images/me.jpg" class="img-circle" alt="Circular Image">
<img src="/images/me.jpg" class="img-thumbnail" alt="Thumbnail Image">

01.PNG

响应式图像

响应式图像保证 100% 宽度，不保证高度。

通过添加 .img-responsive 样式可以将图像变为响应式图像

如果想要居中可以添加 .center-block 样式

<div class="alert alert-info">
    <a href="#" class="close" data-dismiss="alert">×</a>
    <strong>提示：</strong> 改变浏览器的大小可以看到响应式图片如何工作
</div>

<h2>非响应式图片</h2>
<div class="box center-block">
    <img src="/images/girls.jpg" alt="Cloudy Sky">
</div>

<hr>
<h2>响应式图片</h2>
<div class="box center-block">
    <img src="/images/girls.jpg" class="img-responsive " alt="Cloudy Sky">
</div>

02.PNG