Question

CSS 问题，增样让<img 标签的图片自动适应宽度

同时高度也自适应，以保持比例不变，我问的情况主要是指当图片大于外层div时（假设这个div id=abc），小的情况下不同改变

Answer 1

要使图片等比例缩小的话用js解决 <script language="JavaScript" type="text/javascript"> <!-- function DrawImage(ImgD,FitWidth,FitHeight){ var image=new Image(); image.src=ImgD.src; if(image.width>0 && image.height>0){ if(image.width/image.height>= FitWidth/FitHeight){ if(image.width>FitWidth){ ImgD.width=FitWidth; ImgD.height=(image.height*FitWidth)/image.width; }else{ ImgD.width=image.width; ImgD.height=image.height; } } else{ if(image.height>FitHeight){ ImgD.height=FitHeight; ImgD.width=(image.width*FitHeight)/image.height; }else{ ImgD.width=image.width; ImgD.height=image.height; } } } } //--> </script> 然后插入图片的时候加上 onload=javascript:DrawImage(this,550,600); 注：550为最大宽度即div宽度，600为最大高度即div高度，图片就在宽550px，高600px内等比例缩小.这两个数值可根据需要改变 即<img src="uploadfiles/123.gif" onload=javascript:DrawImage(this,550,600); boder=0/>

麻烦采纳，谢谢!

Answer 2

前提是要确定外层DIV的宽度，然后#abc{max-width:最大宽度为多少，可以是具体像素，也可以是百分比，百分比则是外层DIV的百分之多少}

Answer 3

假设这个div  id= abc

css可以是这样的

#abc img{width:100%;height:100%;}

Answer 4

<div style='width:400px;height:auto;text-align:center;float:none;margin-left:auto;margin-right:auto;'>
    <img src="image.jpg" style="width:100%;height:auto;">
</div>