css隐藏滚动条且可以滑动

可以使用CSS的::-webkit-scrollbar伪元素来隐藏滚动条，并且使用overflow: auto属性来实现可滑动的效果，具体的CSS代码如下：
/* 隐藏滚动条 */
::-webkit-scrollbar {
display: none;
}

/* 可滑动 */
overflow: auto;
登录后复制

相关问题

css隐藏滚动条 滑动块

如何在 CSS 中隐藏滚动条但仍保持滑动功能
为了实现隐藏滚动条但仍然允许内容滚动的效果，可以采用特定的 CSS 属性组合。不同浏览器对于此效果的支持略有差异。
隐藏滚动条并保留滚动能力
针对 WebKit 浏览器（如 Chrome 和 Safari），可以通过自定义滚动条样式来达到目的：
/* Hide scrollbar for Chrome, Safari and Opera */
.scrollable-content::-webkit-scrollbar {
display: none;
}

/* Optional: Enable content scrolling */
.scrollable-content {
overflow-y: scroll;
}
登录后复制
对于 Firefox 浏览器，则需利用 -moz-appearance 属性配合 scrollbar-width 来控制：
/* Hide scrollbar for Firefox */
.scrollable-content {
scrollbar-width: none; /* hidden */
overflow-y: scroll;
}
登录后复制
IE 和 Edge (旧版) 可以通过设置 ms-overflow-style 实现相同效果：
/* Hide scrollbar for IE and old versions of Edge */
.scrollable-overflow-style: none; /* Internet Explorer 10+ */
overflow-y: scroll;
}
登录后复制
综合以上方法，在现代跨平台项目中通常会结合使用这些规则以确保兼容性[^2]。

css超出隐藏滚动条可滑动

如果你想在 CSS 中隐藏滚动条并使内容可滑动，可以使用以下方法：

隐藏滚动条：

/* 隐藏滚动条 */
::-webkit-scrollbar {
display: none;
}
登录后复制

使内容可滑动：

/* 使内容可滑动 */
overflow: auto;
登录后复制
将上述两个 CSS 属性一起使用，就可以隐藏滚动条并使内容可滑动了：
/* 隐藏滚动条并使内容可滑动 */
::-webkit-scrollbar {
display: none;
}
overflow: auto;
登录后复制
这样就可以在需要的时候显示滚动条，并且滚动条不会影响页面布局了。