css滚动条

少年包青菜

于 2022-10-18 10:02:43 发布

阅读量143

点赞数 1

文章标签： css 前端 css3

本文链接：https://blog.youkuaiyun.com/m0_50884068/article/details/127382449

版权

/* 滚动条所在容器 */
.roll {
    overflow: hidden;
    background-color: #eee;
    white-space: nowrap;
}

/* 滚动条整体 */
.roll::-webkit-scrollbar {
    width: 5px;
}
/* 两个滚动条交接处 -- x轴和y轴 */
.roll::-webkit-scrollbar-corner {
    background-color: transparent;
}

/* 滚动条滑块 */
.roll::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 5px #05152f;
    background: #535353;
}

/* 滚动条轨道 */
.roll::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 5px #05152f;
    border-radius: 10px;
    background: #ededed;
}