如何自定义浏览器的滚动条呢，下面给大家讲解一下，其实很简单，通过设定css样式就可以实现。

CSS

一、示例代码

/*滚动条整体样式*/ body::-webkit-scrollbar { width: 4px; /*高宽分别对应横竖滚动条的尺寸*/ height: 4px; } /*滚动条里面小方块*/ body::-webkit-scrollbar-thumb { border-radius: 5px; -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); background: #FFF; } /*滚动条里面轨道*/ body::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); border-radius: 0; background: #393D49; }

二、效果展示

实际效果请参考本站浏览器滚动条样式。