bootstrap怎么让图片自适应-木庄网络博客

本文摘自PHP中文网，作者尚，侵删。

bootstrap让图片自适应的方法：

1、如果是在页面上插入图片,就直接加上class="img-responsive"
<img src="..." class="img-responsive center-block" >

2、如果是在内容页里面的话，直接用js给每个img加上属性就可以了。

$(".setting img").addClass("img-responsive center-block"); //center-block 图片水平居中

在 Bootstrap 版本 3 中，通过为图片添加 .img-responsive 类可以让图片支持响应式布局。其实质是为图片设置了 max-width: 100%;、 height: auto; 和 display: block; 属性，从而让图片在其父元素中更好的缩放。

更多Bootstrap相关技术文章，请访问Bootstrap教程栏目进行学习！

以上就是bootstrap怎么让图片自适应的详细内容，更多文章请关注木庄网络博客！

Vue.js 设计与实现基于Vue.js 3 深入解析Vue.js 设计细节

￥83.86元 人民邮电出版社

本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者