怎么让div中的图片自适应缩放大小

( 预览   )

相信大家在做网站布局的时候，经常性会遇到，图片不能很好的适应div的大小的问题。上传的图片不是太宽，就是太窄，老实搞得页面乱七八糟的，很不美观。实在让人头疼，有种简单的方法是使用overflow：hidden：这样虽然能裁掉超出的部分，但也使图片不能显示完整。下面告诉大家一个神奇的方法，来使div中图片自适应大小：

<style type="text/css">
<!--
img {width:expression(this.width>300?"300px":this.width+"px");}
}
-->
</style>

该CSS的功能是：大于300的图片自动调整为300显示。

上面的代码在使用的过程中发现第一次打开页面时图片会缩到很小，需要刷新页面才能实达所设置的大小，故又找到了以下代码：

img{
 max-height:720px; 
 max-width:640px; 
 width:expression(this.width > 640 && this.height < this.width ? 640: true); 
 height:expression(this.height > 720 ? 720: true);
 }

经测试是可以解决图片自适应大小的问题了。

以上资料由拾图网|温州天时网站建设整理。