<style rel="stylesheet" type="text/css">

.lunboimg{ width: 100%; height: auto; float: left;}
.lunboimg img{ width: 100%; float: left;}

</style>

$(function(){
var evt = "onorientationchange" in window ? "orientationchange" : "resize";
window.addEventListener(evt, function () {
location.reload()
}, false); 判定屏幕旋转时，刷新页面，（防止图片获取宽度固定不变，图片不能自适应）

var width =$(window).width(); 获取手机浏览器的宽高
var height=$(window).height();
height=width*0.5; 图片高度=图片宽度的0.2 宽高比：2:1
$("#banner").css({"width":width, "height":height}); 获取缩放后的尺寸
});

<div class="lunboimg">
<img src="img/today.jpg" id="banner" >
</div>