滚动条样式(显示/隐藏)

hy14

于 2024-09-03 09:59:23 发布

阅读量181

点赞数 3

文章标签： javascript 前端 html

本文链接：https://blog.youkuaiyun.com/weixin_58034343/article/details/141852630

版权

让滚动条隐藏：

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

让滚动条一直显示并改变样式：

::-webkit-scrollbar {
  //width: 8px; /* 设置滚动条的宽度 */
  height: 6px;
  background-color: #f0f0f0; /* 设置滚动条的背景颜色 */
  border-radius: 10px; /* 设置滚动条的圆角 */
}

::-webkit-scrollbar-thumb {
  background-color: #98b638; /* 设置滚动条的颜色 */
  border-radius: 10px; /* 设置滚动条的圆角 */
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); /* 设置滚动条的阴影 */
}