图片宽度和高度都大于div,实现图片在div中居中

1，用img标签显示图片时

< style  type = "text/css" >

#out{height:100px; width:150px; position:relative; overflow:hidden;}

#mid{position:absolute;top:50%; left:50%; width:1000px; margin-left:-500px; text-align:center;}

#in{ position:relative; top:-50%;}

</ style >

 

< div  id = "out" >

　　< div  id = "mid" >

　　　　< div  id = "in" >

　　　　< img  src = "http://i2.sinaimg.cn/blog/1/2008/0306/U2725P503T1D169F6DT20080822100708.jpg"  />

　　　　</ div >

　　</ div >

</ div >

 

2，可以把图片当做背景

<style type="text/css">

#odiv {

　　width:150px;

　　height:100px;

}

#odiv .img{

　　display:block;

　　width:208px;

　　height:143px;

　　background:url(' http://i2.sinaimg.cn/blog/1/2008/0306/U2725P503T1D169F6DT20080822100708.jpg') no-repeat center top;

}

</style>

<div id="odiv">

　　<a class="img" href="#"></a>

</div>

转载于:https://www.cnblogs.com/ShowJoy/p/3873326.html