图片溢出div，超出div解决办法

方法二

可以使用一段js来解决

window.onload = function(){

//获取图片元素

var imgs = document.getElementsByTagName("img");

//获取div元素

var contentLeft = document.getElementById("col-md-7");

//使用js设置图片元素宽度的变化

for(var i=0; i

imgs[i].style["max-width"] = contentLeft.offsetWidth - 40 + "px";

}

}

//40是要减去padding

方法三

使用CSS max-width和max-height实现图片自动等比例缩小

很简单我们要使用到max-width和max-height,这样即可设置对象图片最大宽度和最大高度，这样图片就会等比例缩放图片，然图片相对不变形清晰。

使用max-width:300px或max-height:100px，即可解决图片比例缩小。但这样存在一个问题，如果按照宽度缩放，但图片过高会超出溢出盒子，这个时候需要对父级使用overflow:hidden隐藏超出图片内容。但是使用max-width或max-height，IE6不支持，我们需要设置个width:expression(this.width > 300 ? "300px" : this.width);或者height:e­xpression(this.height>100?"100px":this.height);。

此时无论怎么响应，图片永远不会溢出

完整代码如下