CSS怎么修改滚动条样式

CSS怎么修改滚动条样式

打开网页开发工具，新建一个HTML文件

添加填充内容让页面出现滚动条（这一步是为了方便给大家演示！）

编写滚动条样式：body::-webkit-scrollbar{ width:10px; } body::-webkit-scrollbar-track{ background: #999; border-radius:2px; } body::-webkit-scrollbar-thumb{ background: red; border-radius:10px; } body::-webkit-scrollbar-thumb:hover{ background: #333; } body::-webkit-scrollbar-corner{ background: #179a16; }

打开浏览器预览效果：

滚动条参数说明：::-webkit-scrollbar ::-webkit-scrollbar-thumb ::-webkit-scrollbar-track ::-webkit-scrollbar-button ::-webkit-scrollbar-track-piece ::-webkit-scrollbar-corner ::-webkit-resizer

方法总结：

1、新建一个HTML文件2、添加填充内容，让页面出现滚动条3、添加滚动条样式4、预览效果5、查看参数说明