如何去掉滚动条scroll bar 在window系统的Chrome浏览器的挫样子

windows下的Chrome浏览器里 scroll bar 滚动条长这个挫样子:

默认样式
隐藏后
gif

一、隐藏sacroll bar滚动条样子的css代码:

/*webkit内核*/
.scroll-content::-webkit-scrollbar {
    width:0px;
    height:0px;
}
.scroll-content::-webkit-scrollbar-button    {
    background-color:rgba(0,0,0,0);
}
.scroll-content::-webkit-scrollbar-track     {
    background-color:rgba(0,0,0,0);
}
.scroll-content::-webkit-scrollbar-track-piece {
    background-color:rgba(0,0,0,0);
}
.scroll-content::-webkit-scrollbar-thumb{
    background-color:rgba(0,0,0,0);
}
.scroll-content::-webkit-scrollbar-corner {
    background-color:rgba(0,0,0,0);
}
.scroll-content::-webkit-scrollbar-resizer  {
    background-color:rgba(0,0,0,0);
}
.scroll-content::-webkit-scrollbar {
    width:10px;
    height:10px;
}

二、需要的时候给父元素添加class类

// ....你的元素代码

万事大吉,顺眼多了
开森!!!


开森

你可能感兴趣的:(如何去掉滚动条scroll bar 在window系统的Chrome浏览器的挫样子)