自定义滚动条滚动条样式

纯CSS实现支持WebKit的浏览器（如GoogleChrome，AppleSafari）::-webkit-scrollbar--整个滚动条。::-webkit-scrollbar-button--在滚动条按钮上（向上和向下箭头）。::-webkit-scrollbar-thumb—滚动条上的滚动条缩略图。::-webkit-scrollbar-track—滚动条轨道。::-webkit-scrollbar-track-piece—滚动条没有的轨道部分slider.::-webkit-scrollbar-corner—当同时存在垂直和水平滚动条时遇到的部分。::-webkit-resizer—某些元素的角部分的部分样式（例如：textarea可拖动按钮）。具体示例：codepen自定义scrollbarFirefoxscrollbar-color-设置滚动条轨道的颜色和thumbscrollbar-width-设置滚动条出现时的粗细/*关键字值*/scrollbar-color:auto;scrollbar-color:dark;scrollbar-color:light;/*值第一种颜色应用于滚动条拇指，第二种颜色应用于滚动条轨道*/scrollbar-color:rebeccapurplegreen;/*全局值*/scrollbar-color:继承;滚动条颜色：初始；滚动条颜色：未设置；JS实现（跨浏览器支持）使用JS库，例如：simplebar。此外，DasSurma还提供了自定义滚动条（CSSDeep-Dive:matrix3d()ForaFrame-PerfectCustomScrollbar），它使用CSS矩阵构建滚动条。JS不是用来实现滚动功能的（有助于性能），而是用来设置CSS的。示例：来自GoogleChrome实验室的自定义滚动条示例参考资料：MDN:-webkit-scrollbarMDN:scrollbar-colorMDN:scrollbar-widthCSSTricks:TheCurrentStateofStylingScrollbarsCSSTricks:scrollbarCSSDeep-Dive:matrix3d()ForaFrame-PerfectCustom滚动条性能视差