如何在WebKit浏览器中始终显示垂直滚动条？

始终显示垂直滚动条

在某些网页设计中，确保用户可以轻松识别 div 元素中的可滚动内容至关重要。尽管设置了overflow-y:scroll，但在某些操作系统（例如macOS）上未主动使用时，垂直滚动条可能不可见。

解决方案：

要强制垂直滚动条始终显示，请使用以下 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 的浏览器，例如例如 macOS 上的 Safari 和 Chrome。通过自定义滚动条的外观，您可以使其更加突出，并指示可滚动内容的存在，即使它未处于活动使用状态也是如此。

以上是如何在WebKit浏览器中始终显示垂直滚动条？的详细内容。更多信息请关注PHP中文网其他相关文章！