写页面中需要知道的一些兼容方法

首先说一下pc端：pc端一般最恶心的就是ie678 了，那么怎样来兼容它呢？

//ie10以下的样式添加
<!--[if IE]>
//ie10以下版本的css js都可以
<![endif]-->

当页面出现错乱，你可以用以上的方法来做兼容，但是媒体查询就不兼容了，不要怕，我们只需引入一个js就好

<!--[if IE]>
   <script src="https://github.com/a-little-sheep/ie678/blob/master/respond.min.js"></script>
<![endif]-->

这样ie678也就兼容了媒体查询，但是问题又来了，ie10版本以上也会出现问题，那么怎么解决，不要怕，往下看

//ie10以上版本检测
 @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ 专属样式添加 */   
}

在引入的css代码中，添加上这个，在这个里面写一些兼容ie10版本以上的样式，这个只有ie10以上版本兼容

这样就可以完美实现ie的兼容

pc的问题说了，那么说说移动端：

在移动端中就是想要适应所有手机，那么一般会用rem和百分百还有就是媒体查询

//页面是750
<script type="text/javascript" class="setfontsize">
    $( document ).ready(function() {
            Document.documentElement.style.fontSize = document.documentElement.clientWidth / 7.5 + "px";
    });
</script>

这样就可以用rem来写了

有时候会遇到这样的问题，横屏是一版，竖屏又是一版，那么怎么写呢？

/*横屏*/
@media all and (orientation : landscape) { 
/*横屏时样式*/
} 
/*竖屏*/
@media all and (orientation : portrait){ 
/*竖屏时样式*/
}