Bootstrap3 圖片（響應式圖片&圖片形狀）
更新時間：2017年01月04日 08:44:13 作者：杜瑞祺
這篇文章主要介紹了 Bootstrap3 圖片 響應式圖片和圖片形狀的相關資料,需非常不錯，具有參考借鑒價值，需要的朋友可以參考下
本文是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 圖片（響應式圖片&圖片形狀），希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持！
相關文章
跟我學Node.js（四）---Node.js的模塊載入方式與機制
Node.js中模塊可以通過文件路徑或名字獲取模塊的引用。模塊的引用會映射到一個js文件路徑，除非它是一個Node內置模塊。Node的內置模塊公開了一些常用的API給開發(fā)者，并且它們在Node進程開始的時候就預加載了。2014-06-06
這篇文章主要是對JavaScript中的隱式類型轉換進行了詳細分析介紹，需要的朋友可以過來參考下，希望對大家有所幫助2013-12-12
這篇文章主要分享10個常見的前端手寫功能，防抖、節(jié)流、深拷貝、異步控制并發(fā)數、繼承等功能技巧，具有一定的參考價值，需要的小伙伴可以參考一下2022-02-02
javascript字符串對象常用api函數小結(連接,替換,分割,轉換等)
這篇文章主要介紹了javascript字符串對象常用api函數,結合實例形式總結分析了javascript常用的連接、替換、分割、轉換等相關函數與使用方法,需要的朋友可以參考下2016-09-09![怎么在下面的HTML里調用數組cs[]的值](http://img.jbzj.com/images/xgimg/bcimg4.png)
怎么在下面的HTML里調用數組cs[]的值...2007-01-01
underscore之Chaining_動力節(jié)點Java學院整理
本文通過文字說明與代碼的形式給大家介紹了underscore之Chaining的相關知識，感興趣的朋友一起學習吧2017-07-07
Javascript Memoization 緩存函數使用說明
Memoization 是一種將函數返回值緩存起來的方法，學習js 面向對象的朋友可以參考下。2010-05-05
JS判斷不同分辨率調用不同的CSS樣式文件實現思路及測試代碼
最近看一個網站，發(fā)現顯示器不同的分辨率，樣式文件調用的也不一樣，于是很好奇研究并寫了一個,經測試感覺還不錯，感興趣的你可以來看看哦2013-01-01
這篇文章主要介紹了懸浮廣告方法日常收集整理的相關資料,需要的朋友可以參考下2016-03-03
這篇文章主要介紹了javascript編程實現棧的方法,簡單說明了棧的概念、特點并結合實例形式分析了javascript棧的定義、入棧、出棧等操作相關實現技巧,需要的朋友可以參考下2017-04-04