css如何去掉或修改浏览器默认滚动条

去掉浏览器默认滚定条

很简单，只需在出现滚动条的元素加-webkit-scrollbar属性即可，代码如下：

/* .box为当前出现滚动条的容器 */.box::-webkit-scrollbar {display: none}

如果想改变它的样式：

/*滚动条的宽度*/.ant-drawer-wrapper-body::-webkit-scrollbar {width: 4px;height: 105px;}/*外层轨道。可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果*/.ant-drawer-wrapper-body::-webkit-scrollbar-track {width: 4px;height: 80%;background-color: #E0E6F3;-webkit-border-radius: 2em;-moz-border-radius: 2em;border-radius: 2em;}/*滚动条的设置*/.ant-drawer-wrapper-body::-webkit-scrollbar-thumb {background-color: #A4A9C1;background-clip: padding-box;min-height: 28px;max-height: 105px;-webkit-border-radius: 2em;-moz-border-radius: 2em;border-radius: 2em;/* display: none; */}/*滚动条移上去的背景*//* .ant-drawer-wrapper-body::-webkit-scrollbar-thumb:hover {background-color: #fff;} */

还有一种(效果在代码下方)：

::-webkit-scrollbar {width: 5px; height: 10%}::-webkit-scrollbar-track {background-color: #f1f1f1; border-radius: 10px;} /* 滚动条的滑轨背景颜色 */::-webkit-scrollbar-thumb {background-color: #A4A9C1;border-radius: 10px;}

效果：