如何隐藏滚动条并使内容保持可滚动？

Question

我想将 html 页面打印成 PDF 文件，但不想在 PDF 文件中显示滚动条。我的页面有一个可滚动的主体，所以如果我这样设置：

* {
   overflow: hidden;
}

最终 pdf 文件中的正文将不完整。 那么是否有一种方法可以阻止滚动条显示但内容仍然可以滚动？

Answer 1

您可以通过以下方式将滚动条的显示设置为none：

::-webkit-scrollbar {
    display: none;
}

这将在不禁用滚动的情况下隐藏所有滚动条。

编辑：这仅适用于 chrome，为了更好的解释，您可以查看此答案 Hidding Scrollbar

Answer 2

有一个 CSS 规则可以在 Webkit-based 浏览器（Chrome 和 Safari）中隐藏滚动条。该规则是：

.element::-webkit-scrollbar { width: 0 !important }

有一个 CSS 规则可以在 IE 10+ 中隐藏滚动条。该规则是：

.element { -ms-overflow-style: none; }

曾经有一个 CSS 规则可以在 Firefox 中隐藏滚动条，但它已被弃用。该规则是：

.element { overflow: -moz-scrollbars-none; }