核心提示:图片处理(1)图片自适应1.宽自适应style type=text/css.img_warp{ width:50px; height:50px; overflow:hidden; text-align...
图片处理
(1)图片自适应
1.宽自适应
<style type="text/css">
.img_warp{
width:50px;
height:50px;
overflow:hidden;
text-align:center;
img{
max-height:100%;
}
}
</style>
2.高自适应
<style type="text/css">
.img_warp{
width:50px;
height:50px;
overflow:hidden;
img{
max-width: 100%;
vertical-align:middle;
}
}
</style>
(2)相对绝对完全居中法
代码如下:
<style type="text/css">
.imgoverflow{
width: 50px;
height: 50px;
overflow: hidden;
position: relative;
}
.imgoverflow img{
position: absolute;
left: -999px;
right: -999px;
top: -999px;
bottom: -999px;
margin:auto;
}
</style>
<p class="imgoverflow">
<img src="img/CSShutu/circle.png"/>
</p>


