Bootstrap全局样式 - 图片

知识点

类 | 描述

• | :-: | -:
  .img-responsive | max-width: 100%; height: auto; 和 display: block;图片响应式
  .center-block | 图片水平居中
  .img-rounded | 为图片添加圆角 (IE8 不支持)，border-radius:6px
  .img-circle | 添加 border-radius:500px 来让整个图片变成圆形
  .img-thumbnail | 添加内边距（padding）和一个灰色的边框。

在 Internet Explorer 8-10 中，设置为 .img-responsive 的 SVG 图像显示出的尺寸不匀称。为了解决这个问题，在出问题的地方添加 width: 100% \9; 即可。Bootstrap 并没有自动为所有图像元素设置这一属性，因为这会导致其他图像格式出现错乱。

---

实践

    ![](images/img1.jpg)
    ![](images/img1.jpg)
    ![](images/img1.jpg)
    ![](images/img1.jpg)
    ![](images/img1.jpg)