CSS自定义滚动条

大家好，我是半夏👴，一个刚刚开始写文的沙雕程序员.如果喜欢我的文章，可以关注➕ 点赞 👍～
搞前端的半夏 一起学习交流前端，成为更优秀的前端工程师

前言

之前写过一篇scroll-snap让你的滚动条更智能，在那篇文章中，主要介绍了，使用scroll-snap优化滚动，其实这也只是滚动需要优化的一点。其实滚动条才是最需要优化的，因为浏览器的多样性，各个浏览器在滚动条的样式上，也不统一。

当一个网页发不出去，我们尽可能的需要保证样式的一致性，美化滚动条可以解决这个统一的问题，当然了，你一个绚丽的页面，肯定不想出现丑了吧唧的滚动条吧！

滚动条

包含

滚动条包含下面7个元素:

• ::-webkit-scrollbar：整个滚动条

• ::-webkit-scrollbar-button：下下箭头按钮

• ::-webkit-scrollbar-thumb：滚动滑块

• ::-webkit-scrollbar-track：滚动条滑轨