用于强制浏览器显示滚动条的CSS

时间:2012-12-13 16:49:28

标签: javascript html css

我编写了一个Web应用程序,发现当我调整页面大小时,浏览器不会显示它自己的滚动条,因为窗口缩小了。这可以防止用户访问内容。我将我的体宽设置为500px并将导航栏设置为white-space:nowrap。如何让浏览器识别出屏幕右侧有内容?

只是为了澄清我想要浏览器的滚动条而不是任何控件上的滚动条。

3 个答案:

答案 0 :(得分:18)

您可以使用以下其中一项,具体取决于您是要添加水平,垂直还是同时添加两个滚动条:

body    {overflow-x:scroll;}
body    {overflow-y:scroll;}
body    {overflow:scroll;}

但是,我认为如果您在一个部分中显示内容然后执行

#id-of_your_div {overflow:scroll;}

因此,您可以向div添加滚动而不是强制浏览器显示滚动条,那么您的页面将提供更好的用户体验,因为这样的滚动条更易于用户访问。

答案 1 :(得分:4)

您可以将body / element的高度或宽度设置为100.1%,具体取决于您想要滚动的方向和元素。

答案 2 :(得分:3)

不使用宽度,而是使用专门用于此目的的代码。无论是否需要,以下CSS都会强制显示滚动条。

两个滚动条的

......

body {
    overflow: scroll;
}

或仅用于水平滚动条......

body {
    overflow-x: scroll;
}