windows phone8下使用Bootstrap屏幕变小解决方案

当前位置：首页 > 代码实例 > html5 css3代码分类 > 其他 > windows phone8下使用Bootstrap屏幕变小解决方案

Bootstrap虽说在老旧的浏览器中存在问题，但是标准浏览器的普及，它的使用率必然会越来越高，网站快速而美观的开发也将越来越便利，Bootstrap在最新的设备中一般没有任何问题，但是在windows phone8下有一个兼容性问题，就是它会让屏幕显示变小。

解决方案:

在bootstrap.css文件中具有如下代码:

[ 其他 ] 运行代码下载代码

<script>
@-ms-viewport {
  width: device-width;
}
</script>

页面宽度被设置成设备的宽度.而在实际中,并不是想要的结果,需要根据我的网页内容自动适应。

解决方案如下:

[ 其他 ] 运行代码下载代码

<script>
if(navigator.userAgent.match(/IEMobile\\/10\\.0/)){  
  var msViewportStyle = document.createElement("style");
  msViewportStyle.appendChild(
    document.createTextNode(
      "@-ms-viewport{width:auto!important}"
    )
  );
  document.getElementsByTagName("head")[0].appendChild(msViewportStyle);
}
</script>

代码描述：windows phone8 Bootstrap 屏幕变小。windows phone8下使用Bootstrap屏幕变小解决方案

下载全部收藏

153 203

用户评论

大牛，别默默的看了，快登录帮我点评一下吧！:) 登录 | 注册