?

　　

　　圖像在網頁制作中也是常要用到的元素，在Bootstrap框架中對于圖像的樣式風格提供以下幾種風格：

　　1、img-responsive：響應式圖片，主要針對于響應式設計
　　2、img-rounded：圓角圖片
　　3、img-circle：圓形圖片
　　4、img-thumbnail：縮略圖片

<div class="container"><div class="row"><div class="col-sm-4"><img alt="140x140" src="http://placehold.it/140x140"><div>默認圖片</div></div><div class="col-sm-4"><img class="img-rounded" alt="140x140" src="http://placehold.it/140x140"> <div>圓角圖片</div></div><div class="col-sm-4"><img class="img-circle" alt="140x140" src="http://placehold.it/140x140"><div>圓形圖片</div></div><div class="row"><div class="col-sm-6"><img class="img-thumbnail" alt="140x140" src="http://placehold.it/140x140"> <div>縮略圖</div></div><div class="col-sm-6"><img class="img-responsive" alt="140x140" src="http://placehold.it/140x140" style="width:40px;height:40px;"/> <div>響應式圖片</div></div></div></div> </div>

?

轉載于:https://www.cnblogs.com/qingyuan/p/4600949.html

總結

以上是生活随笔為你收集整理的Bootstrap系列 -- 23. 图片的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。