所以目前我有：
#div {
position: relative;
height: 510px;
overflow-y: scroll;
}
但是我不相信对于某些用户来说那里有更多内容是显而易见的。他们可以在不知道我的 div 实际上包含更多内容的情况下向下滚动页面。我使用高度 510px 来截断一些文本，因此在某些页面上看起来确实有更多内容，但这并不适用于所有页面。
我使用的是 Mac，在 Chrome 和 Safari 中，只有当鼠标悬停在 Div 上并且您主动滚动时，才会显示垂直滚动条。有没有办法让它一直显示？
我自己也遇到了这个问题。 OSx Lion 在不使用时隐藏滚动条以使其看起来更“光滑”，但同时出现了您解决的问题：人们有时看不到 div 是否具有滚动功能。
修复：在你的 CSS 中包括 -
::-webkit-scrollbar {
-webkit-appearance: none;
width: 7px;
}
::-webkit-scrollbar-thumb {
border-radius: 4px;
background-color: rgba(0, 0, 0, .5);
box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}
/* 总是显示滚动条 */ ::-webkit-scrollbar { -webkit-appearance: none;宽度：7px； } ::-webkit-scrollbar-thumb { 边框半径：4px;背景色：rgba(0, 0, 0, .5);盒子阴影：0 0 1px rgba(255, 255, 255, .5); } /* 用于演示的 css */ #container { height: 4em; /* 比孩子短 */ overflow-y: scroll; /* 剪辑高度为 4em 并滚动显示其余部分 */ } #child { height: 12em; /* 比父级高强制滚动 */ } /* === 忽略下面的东西，这只是为了帮助视觉。 === */ #container { 背景颜色：#ffc; } #child { 边距：30px;背景颜色：#eee；文本对齐：居中； }
根据需要自定义外观。 Source
请注意，在 iPad Safari 上，如果您的 CSS 中有 -webkit-overflow-scrolling: touch;，NoviceCoding 的解决方案将不起作用。解决方案是删除所有出现的 -webkit-overflow-scrolling: touch; 或将 -webkit-overflow-scrolling: auto; 放入 NoviceCoding 的解决方案中。
webkit-overflow-scrolling isn't really supported。
对于 2021 年及以后来到这里的任何人：
"Custom scrollbars are no longer supported in iOS 14."
根据 developer.apple.com 论坛上的官方“框架工程师”。
根据我的测试，这将适用于 iOS 7.1.x 上的 Safari 上的 iPad，不过我不确定 iOS 6。但是，它不适用于 Firefox。有一个旨在跨浏览器兼容的 jQuery 插件，称为 jScrollPane。
此外，还有一个 duplicate post here on Stack Overflow，其中包含一些其他详细信息。
height添加到::-webkit-scrollbar