适配不同大小浏览器——固定排班

此文介绍的是缩小浏览器，排班不随浏览器窗口大小变化，如果需要排班随浏览器变化，使用bootstrap会更好，今天要介绍的是固定排班

加入JS代码：

  <script language="javascript">
        function readyPage() {

             if (screen.width >= 1600){
                $(".content_container").width(1600);
            }

             else if ((screen.width >= 1400)&& (screen.width < 1600)){
                $(".content_container").width(1400);    //此分辨率下你需要的操作

            } 

              else if ((screen.width >= 1024)&& (screen.width < 1400)){
                $(".content_container").width(1024);    //此分辨率下你需要的操作

            } 

              else if ((screen.width >= 980)&& (screen.width < 1024)){
                $(".content_container").width(980);    //此分辨率下你需要的操作
            }

              else {
                $(".content_container").width(800);     //这个分辨率下你的操作
            }

        }
    </script>

然后再body中，引入js，加入代码：

还有一个方法，浏览器缩小的时候，排班不会随着他缩小而变化太大，但是，目前尝试，是能做到，在本机上全屏展示喔，在其他机器上，可能需要拖动进度条才能看到全屏.

content是我们需要展示的内容，在content前加一个父级div，如下：

<div class="container">

<div class="screenAdaptive">

content

</div>

</div>

对container的宽度，做处理如下：

.container {

width:100%;

height:100%;

margin:0 auto;

}

对content的父级，指定宽度：

.screenAdaptive{

width:1600px;

height:100%;

}

这种方法有局限性，后期如果有好的方法，再次来更新。