css3 滚动条设置背景颜色
导读：CSS3 滚动条设置背景颜色使用CSS3可以对滚动条进行美化，其中之一的方式就是设置滚动条的背景颜色。在此我们介绍如何使用CSS3将滚动条的背景颜色设置为自己想要的颜色。首先，我们需要为滚动条设置样式，在CSS中使用“::-webkit-s...
CSS3 滚动条设置背景颜色使用CSS3可以对滚动条进行美化，其中之一的方式就是设置滚动条的背景颜色。在此我们介绍如何使用CSS3将滚动条的背景颜色设置为自己想要的颜色。
首先，我们需要为滚动条设置样式，在CSS中使用“::-webkit-scrollbar”来表示滚动条。在此，我们为滚动条设置宽度和高度，并将滚动条的背景颜色设置为白色：
pre { ::-webkit-scrollbar { width: 6px; height: 6px; background-color: #fff; } }
接下来，我们需要为滚动条的轨道（即背景）设置样式。在此，我们将轨道的背景颜色设置为深灰色，并为轨道设置圆角：
p { ::-webkit-scrollbar-track { background-color: #333; border-radius: 3px; } }
最后，我们为滚动条的滑块（即拖动滚动条的小方块）设置样式。在此，我们将滑块的背景颜色设置为浅灰色，并为滑块设置圆角：
p { ::-webkit-scrollbar-thumb { background-color: #d3d3d3; border-radius: 3px; } }
通过以上的CSS3代码，我们就可以将滚动条的背景颜色进行自定义设置。你可以根据需要更改上述代码中的颜色值，使得你的网页滚动条更加符合自己的设计需求。
（以上代码只针对webkit内核浏览器，其它浏览器请自行添加相应的兼容代码。）
声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！
若转载请注明出处： css3 滚动条设置背景颜色
本文地址： https://pptw.com/jishu/567939.html