在前端开发的过程中,通常会需要更改滚动条的默认样式
![在这里插入图片描述](https://img-blog.csdnimg.cn/f5e66dfb9f9a4ea5a884e295ac895957.png)
代码如下:
::-webkit-scrollbar {
/*滚动条整体样式*/
/*width: 4px; 高宽分别对应横竖滚动条的尺寸*/
height: 1px;
}
::-webkit-scrollbar-thumb {
/*滚动条里面小方块*/
border-radius: 10px;
box-shadow: inset 0 0 5px #a8a8a8;
background: #a8a8a8;
}
::-webkit-scrollbar-track {
/*滚动条里面轨道*/
box-shadow: inset 0 0 5px #ededed;
border-radius: 10px;
background: #ededed;
}
效果如下:
![在这里插入图片描述](https://img-blog.csdnimg.cn/ea1fdc5f51f7485ba452b292bc8f2562.png)