本文是Bootstrap3基礎系列教程，最后一篇文章，后面還會在寫進階的文章，加個關注吧，還會有好的文章奉獻而來的。

響應式圖片

在 Bootstrap 版本 3 中，通過為圖片添加 .img-responsive 類可以讓圖片支持響應式布局。其實質是為圖片設置了 max-width: 100%; 和 height: auto; 屬性，從而讓圖片在其父元素中更好的縮放。

SVG 圖像和 IE 8-10

在 Internet Explorer 8-10 中，設置為 .img-responsive 的 SVG 圖像顯示出的尺寸不勻稱。為了解決這個問題，在出問題的地方添加 width: 100% /9; 即可。Bootstrap 并沒有自動為所有圖像元素設置這一屬性，因為這會導致其他圖像格式出現錯亂。

<img src="..." class="img-responsive" alt="Responsive image">

圖片形狀

通過為  元素添加以下相應的類，可以讓圖片呈現不同的形狀。

跨瀏覽器兼容性

請時刻牢記：Internet Explorer 8 不支持 CSS3 中的圓角屬性。

<img src="..." alt="..." class="img-rounded"><img src="..." alt="..." class="img-circle"><img src="..." alt="..." class="img-thumbnail">

以上所述是小編給大家介紹的Bootstrap3 圖片（響應式圖片&圖片形狀），希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持！