美化浏览器滚动条

44 阅读1分钟

直接上代码

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
  background-color: transparent;
  border-radius: 10px;
  z-index: 999;
}
::-webkit-scrollbar-track {
  box-shadow: rgba(21, 154, 255, 0.8);
  border-radius: 10px;
  background-color: transparent;
}
::-webkit-scrollbar-thumb {
  /*启用滚动条背景色,解决部分模块滚动条看不见的问题*/
  background-color: rgba(21, 154, 255);
  border-radius: 10px;
}
.el-scrollbar__view {
  border: none! important;
  background: none! important;
  box-shadow: none! important;
}
.el-scrollbar__bar  .is-vertical {
 width: 6px! important;
}
.el-scrollbar__wrap {
  overflow-x: hidden ! important;
  overflow-y: auto ! important;
}
.el-scrollbar__bar.is-horizontal {
  display: none ! important;
}

image.png