今天小编跟大家讲解下有关css图片缩放 通过css控制图片自动缩放至css定义大小 ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关css图片缩放 通过css控制图片自动缩放至css定义大小 的相关资料，希望小伙伴们看了有所帮助。
在文章的内容区中 通常会有图片。如果图片的尺寸过大 常会把页面结构撑得变形。 以前 我采用JS来控制 效果还是不错。 这段时间 一直用DIV+CSS的方式来制作页面 发现用CSS来得更方便 相信处理速度也更高。 方法如下： 程序代码 复制代码代码如下: <div class=”UBBPanel”> <div class=”UBBTitle”> <img src=http://xyrl.com/skin/7ke/image/nopic.gif style=”margin:0px 2px -3px 0px” alt=”程序代码”/> 程序代码</div> <div class=”UBBContent”>.new_body .con img{vertical-align: middle;max-width: 630px; width: expression(this.width >630 && this.height < this.width ? 630: true); } </div></div> 同样可以用对高度进行控制。 这种方法可以满足: 一个页面中 不同图片 超过所需大小时 自动缩成不同尺寸的需求。 应用面也很广 比如：一般的CMS等文章管理中 通常都有小图、大图。而我们在页面上 通常需要读取同一个图片 而分不同尺寸显示。再结合 overflow:hidden; 相信图片也就不会变形了。 程序代码 复制代码代码如下: .pwl_spaceimg{width:160px; height:120px;overflow:hidden; } .pwl_spaceimg img{width:150px; border:0px; padding:4px; } 首先要讲 这个效果最好用js解决。下面是CSS解决方法： 复制代码代码如下:img { max-width:400px; _width:expression_r(this.width<400px?"auto":"400px"); } expression是针对IE6用的 在FF和IE7+版本max-width就行了来源：爱蒂网
