vue 隐藏滚动条

作者：索伦之刃发布日期:2025-06-13 浏览:51

/* 隐藏滚动条的 CSS 代码 */
body {
  /* 隐藏滚动条，但仍然可以滚动 */
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* Internet Explorer 和 Edge */
}

body::-webkit-scrollbar {
  /* 隐藏滚动条（Chrome、Safari 和 Opera） */
  display: none;
}

解释说明：

scrollbar-width: none;：这是用于 Firefox 浏览器的样式，用来隐藏滚动条。
-ms-overflow-style: none;：这是用于 Internet Explorer 和 Edge 浏览器的样式，用来隐藏滚动条。
body::-webkit-scrollbar { display: none; }：这是用于 Chrome、Safari 和 Opera 等基于 WebKit 的浏览器的样式，通过设置 display: none; 来隐藏滚动条。

这段代码可以在保持页面内容可滚动的同时，完全隐藏滚动条的显示。

上一篇：vue响应式布局

下一篇：npm 安装vue3