移动端滚动条样式修改及隐藏

样式修改

::-webkit-scrollbar {
    width:8px; 
    height:14px; 
}
::-webkit-scrollbar-button {
    display:none;
}
::-webkit-scrollbar-track, ::-webkit-scrollbar-track-piece {
    background:-webkit-gradient(linear, left top, right top, from(#f6f6f6), color-stop(50%, #fff), color-stop(75%, #fff), to(#fdfdfd));
    width:11px;
    height:11px;
}
::-webkit-scrollbar-thumb {
    border-width:0;
    border-style:solid;
    border-radius:6px;
    background:#d9d9d9;
}
::-webkit-scrollbar-thumb:horizontal {
    border-width:3px 0;
    border-style:solid;
    border-color:#fefefe;
    border-radius:6px;
    background:#d9d9d9;
}
::-webkit-scrollbar-thumb:hover {
    background:#bdbdbd;
}
::-webkit-scrollbar-thumb:active {
    background:#8e8e8e;
}

滚动条隐藏

::-webkit-scrollbar {
  display: none !important;
  width: 0px;
  height: 0px;
}
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容