bootstrap设置图片的响应式
bootstrap设置网站中内容的图片,根据屏幕的框都变化而变化,使图片也响应式,自适应起来。
在图片中增加两个类 .img-responsive
.center-block
。通过增加这两个样式会把图片设置成块状元素,并设置图片最大的宽度为100%,高度自动。
html
- <img src="路径" class="img-responsive center-block" />
如果图片在文章中插入的,为了避免每次在编辑文章的时候去增加样式,所有可以通过js的设置自动设定图片的样式。直线电机滑台
js
- $(function(){
- //当所有资源加载完后设置
- $('.content img').addClass('img-responsive center-block');
- });