关于移动端横屏问题适配

监听移动端浏览器事件

//判断屏幕方向
if(window.orientation==90||window.orientation==-90){
  alert("横屏状态！")
}
//监听屏幕方向
window.onorientationchange = function(){ 
  switch(window.orientation){ 
    case -90: 
    case 90: 
      alert("横屏:" + window.orientation);
    case 0: 
    case 180: 
       alert("竖屏:" + window.orientation);
    break; 
  } 
}

css自动响应适配

<!--css媒介查询判断-- 
@media (orientation: portrait) { } 横屏
@media (orientation: landscape) { }竖屏