如何在Windows浏览器上自动隐藏滚动条

Question

我有npm install --production的几个元素。它很好用。在macOS上，滚动条会在用户不滚动时自动隐藏，并在滚动时显示。

在Windows和任何浏览器上，滚动条始终可见。它渲染得很难看。

那么当用户不滚动时，如何在每个操作系统和每个浏览器上自动隐藏滚动条？

我知道有很多类似的问题，但我没有找到合适的答案

Answer 1

perfect-scrollbar是

  

简约但完美的自定义滚动条插件

几乎适用于所有网络浏览器，包括Internet Explorer。

Answer 2

我发现了什么！我从没想过会这么简单：

.my-elem {
  overflow: hidden
} 

.my-elem:hover {
  overflow: auto
}

Answer 3

<style type="text/css">
body {
    overflow:hidden;
}
</style>

上面的代码隐藏了水平和垂直滚动条。

由于每个浏览器都有自己的默认“用户代理”样式表，因此您可能必须执行 CSS重置，将所有HTML元素的样式重置为一致的基线。那么您的HTML在所有浏览器上都会显示相同的内容。

您还可以标准化。 Normalize.css 保留有用的默认值，而不是“取消”所有内容。