滚动条样式自定义

发表于2024-01-16更新于2024-01-16

css隐藏滚动条

1
2
3
4
::-webkit-scrollbar{
    width:0;
    height:0;
}

隐藏滚动条的样式对某个类失效

1
2
3
4
:not(.activity-rule)::-webkit-scrollbar {
    width:0;
    height:0;
}

调整滚动条背景样式

1
2
3
4
5
::-webkit-scrollbar{
    width:6px;
    border-radius:10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}

调整滚动条小滑块样式

1
2
3
4
::-webkit-scrollbar-thumb{
    background: #FFEFA9;
    border-radius: 10px;
}