欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

-webkit 内核浏览器 自定义滚动条样式

程序员文章站 2024-01-28 15:57:40
...

-webkit 内核浏览器 自定义滚动条样式

实例代码针对-webkit 内核浏览器滚动条样式的设置以及使用方法,记录并提供给大家学习参考。

声明出现滚动的容器(#scrollWrap):overflow:auto。

#scrollWrap::-webkit-scrollbar-track {
    background-color: transparent
}

#scrollWrap::-webkit-scrollbar {
    width: 6px
}

#scrollWrap::-webkit-scrollbar-thumb {
    border-radius: 6px;
    background-color: #ccc
}

#scrollWrap::-webkit-scrollbar-thumb:hover {
    background-color: #aaa
}