css隐藏滚动条但能滚动

可以使用 CSS 的伪元素 ::-webkit-scrollbar 来隐藏滚动条，但是仍然允许滚动。具体实现方法如下所示：

/* 隐藏垂直滚动条 */
::-webkit-scrollbar {
  width: 0;
}

/* 隐藏水平滚动条 */
::-webkit-scrollbar-horizontal {
  height: 0;
}

/* 隐藏滚动条上的按钮（上下箭头） */
::-webkit-scrollbar-button {
  display: none;
}

/* 隐藏滚动条的轨道（背景） */
::-webkit-scrollbar-track {
  display: none;
}

/* 隐藏滚动条的滑块（拖动条） */
::-webkit-scrollbar-thumb {
  display: none;
}

使用以上代码即可隐藏滚动条，但是仍然可以通过鼠标滚轮或者触摸屏幕的方式进行滚动。

相关问题

css 隐藏滚动条

使用CSS隐藏滚动条有几种方法可以实现。其中一种方法是通过设置父元素的overflow属性为hidden，然后设置子元素的overflow-x或overflow-y属性为scroll，并通过设置子元素的margin或padding来隐藏滚动条。

另一种方法是使用::-webkit-scrollbar伪元素选择器，这个选择器只在webkit内核的浏览器中有效，如Chrome、新版Edge、Safari等。通过将::-webkit-scrollbar的display属性设置为none，可以直接选择滚动条元素并隐藏它。

下面是一个实现隐藏滚动条的CSS代码示例：
.hide-bar {
width: 100px;
height: 100px;
border: 1px solid #ccc;
overflow-x: hidden;
overflow-y: scroll;
}

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

<div class="hide-bar">
这是一段文本这是一段文本这是一段文本这是一段文本这是一段文本这是一段文本这是一段文本这是一段文本
</div>

css隐藏滚动条样式

通过CSS可以隐藏滚动条样式，具体实现方法如下：
1. 首先需要明确，滚动条是在哪层元素上有。父box？子box？
2. 在父元素上设置overflow：auto/scroll时，子元素溢出，则会显示出滚动条。
3. 可以通过以下代码来隐藏滚动条样式：
.father::-webkit-scrollbar {
width: 0;
height: 0;
display: none;
}
.father {
scrollbar-width: none;
-ms-overflow-style: none;
}
其中，::-webkit-scrollbar是针对webkit内核的浏览器，scrollbar-width和-ms-overflow-style是针对Firefox和IE浏览器的。
以上代码可以隐藏所有浏览器滚动条的兼容性写法。