---

有时候觉得浏览器自带的滚动条，实在是太丑了，一点点内容超出比例，就是多大的一个滚动条就来了，实在是遭不住，所以我就动手了！！！
下图是浏览器自带的滚动条：

自定义滚动条实例代码：

如有不足，还望指正

/*//内层滚动条凹槽的颜色，还可以设置边框属性 */::-webkit-scrollbar-track-piece {background-color:#f8f8f8;}/*//滚动条的的整体部分 */::-webkit-scrollbar {width: 4px;//纵向滚动跳的宽度height: 9px;//横向滚动条的高度}/*//滚动滑块的设置 */::-webkit-scrollbar-thumb {background-color: rgba(170, 175, 175, 0.69);//滚动条的颜色background-clip:padding-box;border-radius: 10px;//滚动条设置圆角min-height:28px;//最小高度}//鼠标放置在滚动滑块上改变，滚动滑块的颜色::-webkit-scrollbar-thumb:hover {background-color: rgba(32, 154, 255, 0.48);//鼠标放在滚动条上，滚动条改变颜色}

截图效果：

如有需要可再自行调节代码，设置样式~~

---

创作不易，如果这篇文章能够帮助到你，希望能关注或收藏一下博主，如果文章内容有问题也可留言讨论，我们一起学习，一起进步！！如有小伙伴有更好的方法，希望能与博主分享哦