css不显示滚动条

作者：洮娦ゞ发布日期:2026-01-30 浏览:16

/* 隐藏滚动条，但仍然可以滚动 */
body {
  /* 隐藏 Chrome, Safari 和 Opera 的滚动条 */
  &::-webkit-scrollbar {
    display: none;
  }

  /* 隐藏 IE, Edge 和 Firefox 的滚动条 */
  -ms-overflow-style: none;  /* IE 和 Edge */
  scrollbar-width: none;     /* Firefox */
}

解释说明：

::-webkit-scrollbar 是 WebKit 浏览器（如 Chrome、Safari 和 Opera）的伪元素，用于自定义滚动条的样式。通过设置 display: none; 可以隐藏滚动条。
-ms-overflow-style: none; 适用于 IE 和 Edge 浏览器，隐藏滚动条。
scrollbar-width: none; 适用于 Firefox 浏览器，隐藏滚动条。

这样设置后，页面中的滚动条将被隐藏，但用户仍然可以通过鼠标滚轮或触摸板进行滚动操作。

上一篇：css grid generator

下一篇：什么是css样式