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

问题描述：

我有几个元素overflow: auto。它工作很好。在macOS上，滚动条在用户不滚动时自动隐藏并显示在滚动条上。如何自动隐藏Windows浏览器上的滚动条

在窗口和任何浏览器上，滚动条总是可见的。它做了一个丑陋的渲染。

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

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

我认为这取决于浏览器如何处理滚动条，并且您可以做的事情不多。唯一真正的crossbrowser解决方案是用JS编写自己的滚动条。 –

这是否给你可以使用的东西：https://*.com/q/3296644/125981 –

答

简约主义的完美定制的滚动条插件

它与几乎所有的网络浏览器，包括Internet Explorer。

不错，但我想找到一些东西，而不必使用js –

答

我发现了一些东西！我从来没有想过这可能是如此简单：

.my-elem { 
    overflow: hidden 
} 

.my-elem:hover { 
    overflow: auto 
}

答

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

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

由于每个浏览器都有自己默认的“用户代理”的样式表，你可能需要做一个CSS重置是重置所有的HTML元素一致的基准的造型。那么你的HTML在所有浏览器上都会显示相同。您也可以标准化。 Normalize.css保留有用的默认值，而不是“不重叠”的所有内容。