让image居中对齐，网页自适应

<div class="page4_content">
 <div class="page4_box">
  <div class="page_bg_16">
    <img src="fuka.jpg">
  </div>
 </div>
</div>
.page4_content{width:100%; height:200px;}
.page4_content .page4_box {
width: 100%;
height: 100%;
left: 50%;
margin-left: -100%;
}
.page4_content .page4_box .page_bg_16{
display: block;
width: 200%;
height: 100%;
overflow: hidden;
position: absolute;
text-align: center;
}
.page4_content .page_bg_16 img, .page4_content .page_bg_4 img {
height: 100%;
display: inline-block;
width: auto;
margin: 0 auto;
text-align: center;
}

所遇到的问题：让图片像背景图片一样居中对齐。

思路：在img的外框的div上写200%；让image居中。然后针对image 的外框进行居中对其。

让图片根据高度自适应，宽度始终是居中的状态。宽度多余的部分隐藏