制作主要滚动条始终可见(Making the main scrollbar always visib

什么CSS需要使浏览器的垂直滚动条仍然可见当用户访问一个网页（当页面有没有足够的内容来触发滚动条的激活）？

Answer 1:

html {
    overflow: -moz-scrollbars-vertical; 
    overflow-y: scroll;
}

在需要的时候这使滚动条始终可见并且才有效。

更新：如果只是用这种可将以上不起作用。

html {
    overflow-y:scroll;
}

Answer 2:

html {
    overflow-y: scroll;
}

那是你要的吗？

不幸的是，歌剧9.64似乎在应用于忽略CSS声明HTML或BODY ，然而它可以用于其他块级元素，比如DIV 。

Answer 3:

事情已经在过去几年改变。以上这些问题的答案都无效在所有情况下更多。苹果推消失滚动条随处可见。 Safari浏览器，Chrome和火狐甚至在MacOS（和IOS）只显示滚动条滚动的实际时 - 我不知道当前的Windows / IE。不过也有不规范的方式来风格的滚动条上的Webkit（IE下降是很久以前的事）。

Answer 4:

确保溢出设置为“滚动”而不是“自动”。 随着中说 ，在OS X Lion中，溢出设置为“滚动”的行为更像在滚动条汽车将仍然只被使用时显示。因此，如果任何解决方案上面似乎没有被工作这可能是为什么。

这就是你需要解决它：

::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 7px;
}
::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: rgba(0, 0, 0, .5);
  -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}

您可以相应风格，如果你不喜欢默认的。

Answer 5:

body { height:101%; } body { height:101%; }将“作物”更大的页面。

相反，我使用：

body { min-height:101%; }

Answer 6:

html {height: 101%;}

我用这个跨浏览器解决方案 （注：我一直使用DOCTYPE声明的第一行，我不知道，如果它工作在怪异模式，从来没有测试 ）。

这将始终显示在每个页面的ACTIVE垂直滚动条 ，垂直滚动条将滚动只有几个像素。

当页面内容比浏览器的可见区域（视口）短，你仍然可以看到垂直滚动条活跃，这将是滚动的只有几个像素。

如果您正在使用CSS验证（我obesessed只能用HTML验证）痴迷通过使用该解决方案您的CSS代码，因为你不使用非标准的CSS也验证了W3C属性，如-moz-scrollbars-vertical

Answer 7:

我可以将它添加到身体标记得到这个工作。因为我没有html元素上的任何东西对我来说更好。

body {
    overflow-y: scroll;
}

Answer 8:

另一种方法是设置html元素到100vw的宽度。在许多如果不是大多数的浏览器，这否定滚动条的宽度的效果。

html { width: 100vw; }

Answer 9:

设置高度101％是我的解决问题的办法。您的页面将不再是“甩尾”那些超出视口高度和那些不之间切换时。

Answer 10:

此代码添加到您的CSS样式表：

html {overflow-y: scroll;}

这里的所有都是它的！

文章来源: Making the main scrollbar always visible