今天用vue3写项目时用element-plus时遇到了一个问题，el-main里面的内容溢出了但是窗口不能滚动，而且设计的样式滚动时滚动条时隐藏的，到处查阅后折腾了好久终于把样式写好了。在这里分享给大家，避免大家踩坑。

要实现el-main内容溢出时可以滚动并隐藏滚动条，你可以使用CSS中的overflow: auto属性来显示滚动条，并通过CSS样式来隐藏滚动条。以下是一种实现方法：

在上述示例中，.el-main类的元素使用overflow: auto属性来显示滚动条，并使用自定义样式隐藏滚动条。通过设置scrollbar-width和scrollbar-color属性，可以定义滚动条的宽度和颜色。通过伪元素选择器和::-webkit-scrollbar选择器，可以定义滚动条的样式，并将滚动条的背景颜色和滑块颜色设置为透明，从而隐藏滚动条。注意一定要用 :depp（）深入覆盖样式！

需要注意的是，这种方法使用了Webkit浏览器的私有样式规则::-webkit-scrollbar，在其他浏览器中可能不适用。如果你需要在不同浏览器中都能正常工作，可以考虑使用JavaScript库或自定义滚动条的解决方案。

请注意，这种方法只是通过样式隐藏了滚动条，但仍然可以通过鼠标滚轮或拖动来滚动内容。