图片宽度和高度都大于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>