如何隐藏滚动条和内容可滚动？

Question

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

* {
   overflow: hidden;
}

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

Answer 1

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

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

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

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

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

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

Answer 2

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

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

这将隐藏所有滚动条而不禁用滚动。

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