Bootstrap的图片响应式支持

Bootstrap的图片响应式支持

使用Bootstrap要满足图片响应式需求的朋友,只需要在HTML代码中给图片加上以下CSS样式即可:

.img-responsive


下面是完整的示例:

<div id="mainText">
...
<img src="images/ipmay.png" class=".img-responsive">
...
</div>


当然,如果网页的内容已经固定下来,不想修改,可以通过jQuery动态添加样式实现。

比如,上面示例中的代码可以加上以下jQuery代码即可:

<script>
$(document).ready(function(){
  $.each($("#mainText img"), function(ekey){
    if(!$(this).hasClass("img-responsive")) {
      $(this).addClass("img-responsive");
    }
  });
});
</script>


6