zoukankan      html  css  js  c++  java
  • -ms-viewport的问题

    Windows 8 中的 Internet Explorer 10 和 Windows Phone 8 Internet Explorer 10 doesn't differentiate device width from viewport width, and thus doesn't properly apply the media queries in Bootstrap's CSS. Normally you'd just add a quick snippet of CSS to fix this:

    Internet Explorer 10并没有将屏幕的宽度和视口(viewport)的宽度区别开,这就导致Bootstrap中的媒体查询并不能很好的发挥作用。为了解决这个问题,你可以引入下面列出的这段CSS暂时修复此问题:

    @-ms-viewport       {  device-width; }
    

    然而,这样做会导致Windows Phone 8 设备按照桌面浏览器的方式呈现页面,而不是较窄的“手机”呈现方式。为了解决这个问题,还需要加入以下CSS和JavaScript代码,直到微软修复此问题。

    @-webkit-viewport   {  device-width; }
    @-moz-viewport      {  device-width; }
    @-ms-viewport       {  device-width; }
    @-o-viewport        {  device-width; }
    @viewport           {  device-width; }
    
    if (navigator.userAgent.match(/IEMobile/10.0/)) {
      var msViewportStyle = document.createElement("style")
      msViewportStyle.appendChild(
        document.createTextNode(
          "@-ms-viewport{auto!important}"
        )
      )
      document.getElementsByTagName("head")[0].appendChild(msViewportStyle)
    }
    

    请查看Windows Phone 8 and Device-Width以了解更多信息。

  • 相关阅读:
    char/unsigned char/int/short 存储范围
    js 数字数组按大小排序
    【转】Vue生命周期
    mvn+spring+webapp模板
    【转存】Vue组件选项props
    eclipse -- git 显示修改历史 对比文件
    eclipse -- git 提示
    mysql -- 查询并插入
    git --eclipse -- 下载超时
    mysql -- 字符串长度
  • 原文地址:https://www.cnblogs.com/rubylouvre/p/3360986.html
Copyright © 2011-2022 走看看