现在网站，首页banner一般是大图，由于要兼容台式机高分辨率，都会使用1600px或者1920px的图片。
但这些大图在小屏幕下的显示，会让人有点头疼。
网上搜了很多，复制的，拷贝的，都没几个自己写自己测试过的。now，看过来，下面两种做法可以解决你的难言之隐~ 哈哈~
方法一：最简洁，利用background 50%
<html>
<body>
<style>
.banner {
height: 339px;
background: #d8d9de url(banner2.jpg) no-repeat
50% 0;
}
</style>
<section id="home_banner" class="banner"></section>
</body>
</html>
方法二：有时必须用img标签的情况
.dd{
margin: 0 auto;
position:relative;
overflow:hidden;
}
.mm{
position:absolute;
left:50%;
width:1920px;
}
.ff{
position:absolute;
left:-50%;
}
这个涉及到数学上的转换，大家自己思考了。我这也是拾取他人牙慧，经自己琢磨改写的。效果很不错，推荐~
原文：http://www.cnblogs.com/zhongyuan/p/3613857.html