css滚动条带有进度背景色

2020-04-20108次阅读css3css

通过box-shadow来实现滚动条带有进度背景色。

:root {
  --shadow: #43a047;
  --scrollbarBG: #eee;
  --thumbBG: #66bb6a;
}
::-webkit-scrollbar {
  width: 16px;
}
::-webkit-scrollbar-track {
  background: var(--scrollbarBG);
}
::-webkit-scrollbar-thumb {
  background-color: var(--thumbBG);
  box-shadow: 0 -100vh 0 100vh var(--shadow), 0 0 15px 5px black;
}

转载自:https://css-tricks.com/css-scrollbar-with-progress-meter/

上一篇: 将HTML字符串转换为DOM对象  下一篇: css3实战linear-gradient渐变背景色平铺  

css滚动条带有进度背景色相关文章