css图片自适应

来源:互联网 发布:招生网络咨询技巧 编辑:程序博客网 时间:2024/05/16 08:01
在加载一些图片的时候,图片的大小是不知道的,但是图片的包裹框大小是固定的。
<div class='wrapper'>    <img scr='img.jpg'/></div>
第一种情况:图片不失真,自动适应div。
.wrapper{width:200px;height:200px;overflow:hidden;}img{width:100%;height:auto;}

也可以用

img{max-width:100%;_width:expression((document.documentElement.clientWidth||document.body.clientWidth)<200?"200px":""); overflow:hidden; }

第二种情况,图片充满div,可以失真。

img{width:100%;height:100%;display:block;}
0 0
原创粉丝点击