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

Question

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

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

Answer 1

您可以使用以下选项之一，具体取决于您是要添加水平滚动条、垂直滚动条还是同时添加两个滚动条：

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

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

#id-of_your_div {overflow:scroll;}

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

Answer 2

您可以将主体/元素的高度或宽度设置为 100.1%，具体取决于您希望滚动的方向和元素。

Answer 3

不要使用宽度，而是使用为此目的而设计的代码。无论是否需要，以下 CSS 都会强制显示滚动条。

对于两个滚动条...

body {
    overflow: scroll;
}

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

body {
    overflow-x: scroll;
}