设置CSS滚动条样式

最新推荐文章于 2024-03-27 10:30:00 发布

风哑

最新推荐文章于 2024-03-27 10:30:00 发布

阅读量804

点赞数

分类专栏：前端_css效果文章标签： css 前端 css3

本文链接：https://blog.csdn.net/A_Common_Man/article/details/126487623

版权

前端_css效果专栏收录该内容

7 篇文章 0 订阅

订阅专栏

方法：

类名 + ::-webkit-scrollbar

比如我这里的类名是.scrolly，这个类名是给出现滚动条的父盒子设置的

/* 设置整个滚动条  */
.scrolly::-webkit-scrollbar {
    width: 5px;
}
/* 设置滚动条中 拖动的块 */
.scrolly::-webkit-scrollbar-thumb{
    background: #0f5260;
    border-radius: 10px;
}
/* 设置滚动条中 整个滚动距离 */
.scrolly::-webkit-scrollbar-track{
    background: transparent;
}

页面效果：