css笔记:CSS显示图片中间区域

css在不改变图片尺寸情况下在固定容器内显示图片的中间区域 
下面三种方法: 

<div style="100px;height:100px;>
    <img src="1.jpg" width="500" height="300" alt="" style="margin-top:-150px;margin-left:-250px;" />
</div>
  • 1
  • 2
  • 3

②作为容器的背景图片

<div style="100px;height:100px;background:url(1.jpg) no-repeat center center">
</div>
  • 1
  • 2

③ 
相对定位绝对定位,设置left,top的值

<div class="div1">
    <img src="1.jpg" width="500" height="300" alt="" />
</div>
<style>
.div1{100px;height:100px;position:relative;}
.div1 img{widht:500px;height:300px;position:absolute;left:-250px;top:-150px;}
</style>

转载自:http://blog.csdn.net/Miss_Audrey/article/details/53544763
原文地址:https://www.cnblogs.com/luziluck/p/8056461.html