在 IE 浏览器中,使用 bootstrap 使得页面滚动条浮动显示,自动隐藏,自动消失

貌似是从 IE10 开始?为了触屏操作优化浏览器的内容显示,IE 浏览器提供了一种可以浮动显示,自动隐藏的滚动条样式,但是这个样式会在某些情况下造成一些困扰,比如下图。。。

其实默认情况下,桌面版的 IE 应该是传统的滚动条样式;而在应用版的 IE 中,滚动条默认才是浮动显示,自动隐藏。

但是可能会发现,一些使用了 bootstrap 样式的网站,也会出现相同这种情况,谷歌了一下,发现这是因为 bootstrap 设置了一个 CSS 的属性:

@-ms-viewport {
  width: device-width;
}

来源:http://channel9.msdn.com/Forums/Coffeehouse/IE10-how-does-the-scrollbar-autohide-on-buildwindowscom-microsoftcom

如果想更改滚动条的样式,可以为 IE 浏览器强制设置一个样式:

html, body {
    -ms-overflow-style: scrollbar;
}

MSDN:https://msdn.microsoft.com/en-us/library/ie/hh771902(v=vs.85).aspx

时间: 2024-08-04 15:19:48

在 IE 浏览器中,使用 bootstrap 使得页面滚动条浮动显示,自动隐藏,自动消失的相关文章

深入浅出经典面试题:从浏览器中输入URL到页面加载发生了什么 - Part 1

背景 “从浏览器中输入URL到页面加载的发生了什么“,这是一道经典的面试题,涉及到的知识面非常多,但作为一个自认为对网络知识掌握的比较好的老码农来说,回答这个问题自然不在话下.如果这道题目如果在面试出现,对我来说就是送分题啊.尽管如此,我还是愿意花一些时间根据我自己的理解回答一下这个题目,看我自己到底掌握的有多深,同时也把自己的知识梳理一下. 这让我想起另外一件往事,这道题有点类似于“在手机上浏览器上输入一个URL,手机做了一些什么”,我当时学习通信里的核心网时就给自己提出过这个问题. 我非常愿

控制页面元素的显示和隐藏

CreateTime--2017年7月13日07:30:55Author:Marydon js控制页面元素的显示和隐藏&<c:if></c:if>标签控制页面元素的显示和隐藏 说明:本文的重点在使用后者实现 实例: 医嘱类型分为:长嘱,临嘱,中医三种,页面默认只显示长嘱信息,点击临嘱或中医显示对应信息:选中变色. CSS部分: /* 医嘱:长嘱,临嘱,中医样式显示 Start*/ .yz_td1 { line-height: 28px; height: 28px; padd

利用来JS控制页面控件显示和隐藏有两种方法

利用来JS控制页面控件显示和隐藏有两种方法,两种方法分别利用HTML的style中的两个属性,两种方法的不同之处在于控件隐藏后是否还在页面上占空位. 方法一:  1 2 document.getElementById("EleId").style.visibility="hidden"; document.getElementById("EleId").style.visibility="visible"; 利用上述方法实现隐

浏览器从输入URL到页面加载显示完成全过程解析

一 浏览器查找域名对应的 IP 地址(域名解析的过程,先进行缓存的查看): 1.在浏览器中输入www.qq.com域名,操作系统会先检查自己本地的hosts文件是否有这个网址映射关系,如果有,就先调用这个IP地址映射,完成域名解析. 2.如果hosts里没有这个域名的映射,则查找本地DNS解析器缓存,是否有这个网址映射关系,如果有,直接返回,完成域名解析. 3.如果hosts与本地DNS解析器缓存都没有相应的网址映射关系,首先会找TCP/ip参数中设置的首选DNS服务器,在此我们叫它本地DNS服

简简单单,jquery中,使用checkbox控制div的显示与隐藏

今天开发代码时,发现好久不用jquery就生疏了. 所以作这个记录, 使用checkbox控制div的显示与隐藏. 一,html代码处: <input type="checkbox" name="checkYaml" id="checkYaml" /> Yaml发布 <div id="branch_build_div"> {{ form.branch_build }} </div> 二,JS

nuxt框架在ie9浏览器中按f5刷新页面非default布局组建最终被default布局组建所替代

假设项目有a b c三个页面  a页面中有顶部tap导航.banner页 其他内容 b页面有顶部tap导航 小的banner页 其他内容 c页面 有顶部tap导航 其他页面 原先的我是写了三个布局 布局1(default)tap + banner 布局2 (nav)tap + smbanner 布局3 (tap) tap 这样写最终导致了在ie9刷新的时候 b c页面都显示为default布局组建 解决方法是 一个default布局里面只有 tap组件 另外两个布局(nav tap)的组建内容直

微信H5支付,从第三方手机浏览器中直接打开支付页面

首先在商户平台通开H5支付功能,然后帮后绑定,支付完成之后需要跳转的地址,开通之后就可以开发H5支付: 首先是签名,卧槽,说到这个就想骂人, 官方文档的解说:文科生哪能看得懂什么是集合: 下面就来签名: <?php //生成随机字符串 function getNonceNum($numLen=16){ $chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"; $str = "&q

IE浏览器中图片路径正确&lt; img ... /&gt;标签不显示图片

如下图所示,下面的html要去加载上面的jpg图片: 代码如下: <img src="luzhanshi1.jpg" alt="图片加载失败"> 使用谷歌打开这个html图片正常显示,但是使用IE浏览器就显示图片加载失败 路径肯定没有错,后来想了想,这个jpg图片原来是png格式的,我只不过强制把后缀名改了,最后我采取下面的办法解决了问题: 原文地址:https://www.cnblogs.com/luzhanshi/p/11009695.html

代码中设置 actionbar 上home等图标显示跟隐藏

今天在做项目的时候,遇到了一个问题,就是要把home在代码中动态显示跟隐藏.现在把方法记录如下 我们可以使用 setDisplayOptions(mask, mask); 来设置home按钮显示的,它的具体用法如下 (1)如果只有一个参数,那么它就是直接设定显示项, 如, int options = DISPLAY_SHOW_HOME | DISPLAY_USE_LOGO: setDisplayOptions(options); 那么,actionbar就会显示home跟log按钮,也就是,里面