<link rel="stylesheet" type="text/css" href="/css/main.css" id="css_link_id"/>

<script type="text/javascript">
var supportsOrientationChange = "onorientationchange" in window,orientationEvent = supportsOrientationChange ? "orientationchange" : "resize";
var css_link=document.getElementById("css_link_id"); 
function myorientation(){
var ua = navigator.userAgent;
   var deviceType="";
   //判断设备类型,ipad跟android手机，倒屏角度不一样，所以需要区分开
   if (ua.indexOf("iPad") > 0) {
      deviceType = "isIpad";
   } else if (ua.indexOf("Android") > 0) {
      deviceType = "isAndroid";
   } else {
   }
   var isHorizontal=true;
    // 判断横竖屏 
    if ("isIpad" == deviceType) {
      if (Math.abs(window.orientation) == 90) {
      isHorizontal=false;
      } else {
          isHorizontal=true;
      }
   } else if ("isAndroid" == deviceType ) {
      if (Math.abs(window.orientation) != 90) {
          isHorizontal=false;
      } else {
      isHorizontal=true;
      }
   }
if(isHorizontal){
css_link.setAttribute("href","/css/main.css"); //默认横屏样式
}else{
css_link.setAttribute("href","/css/main-vertical.css"); //竖屏样式
}
}
// 监听事件
window.addEventListener(orientationEvent, function() {
myorientation();//倒屏时，判断横竖屏
}, false);
myorientation();//第一次加载时，判断横竖屏

</script>

至于某些国产平板，可能就不行了

最近楼主写了一篇，css自动适配手机，平板，电脑

http://www.choujone.com/blog/1397200870519