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

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

* {
   overflow: hidden;
}

最终pdf文件中的正文将不完整。

---

因此，如果有办法阻止滚动条显示，但内容仍然可以滚动？

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

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

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

---

编辑：这只适用于chrome，要获得更好的解释，您可以查看此答案。

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

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

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

---

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

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

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

过去有一个CSS规则可以在Firefox中隐藏滚动条，但后来被弃用了。该规则是：

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

---

这是最好的方法。显示为无。