vue+element项目全局滚动条优化

最新推荐文章于 2024-05-23 11:03:02 发布

Icon_酱

最新推荐文章于 2024-05-23 11:03:02 发布

阅读量315

点赞数

文章标签： css vue 前端 Powered by 金山文档

本文链接：https://blog.csdn.net/yytIcon/article/details/129578746

版权

在全局样式文件中放入以下代码

 /*滚动条的宽度和高度*/
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    width: 5px;
    background-color: rgba(238, 238, 238, 0.5);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
} 
/*滚动条的设置*/
::-webkit-scrollbar-thumb {
    background-color: rgba(193, 193, 193, 0.75);
    background-clip: padding-box;
    min-height: 28px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
} 
/*滚动条移上去显示的的颜色*/
::-webkit-scrollbar-thumb:hover {
    background-color: red;
}