热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

css滚动条样式重写(兼容ie和谷歌)

*清除滑条样式*::-webkit-scrollbar{width:0;height:0;background:none;}*chrome--------------------------------------------start*::-webkit-scrollbar{width:6p
/* 清除滑条样式 */
::-webkit-scrollbar {
    width: 0;
    height: 0;
    background: none;
}

/*chrome--------------------------------------------start*/
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

/* Track */
::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0);
    border-radius: 6px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: rgba(201, 201, 202, 1);
    border-radius: 6px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: rgba(162, 162, 163, 1);
}
/*chrome--------------------------------------------end*/
/*IE--------------------------------------------start*/
* {
    /*三角箭头的颜色*/
    scrollbar-arrow-color: #c0c4cc;
    /*滚动条滑块按钮的颜色*/
    scrollbar-face-color: #A2A2A3;
    /*滚动条整体颜色*/
    scrollbar-highlight-color: #A2A2A3;
    /*滚动条阴影*/
    scrollbar-shadow-color: #A2A2A3;
    /*滚动条轨道颜色*/
    scrollbar-track-color: #f4f4f5;
    /*滚动条3d亮色阴影边框的外观颜色——左边和上边的阴影色*/
    scrollbar-3dlight-color: #A2A2A3;
    /*滚动条3d暗色阴影边框的外观颜色——右边和下边的阴影色*/
    scrollbar-darkshadow-color: #A2A2A3;
    /*滚动条基准颜色*/
    scrollbar-base-color: #f4f4f5;
}
/*IE--------------------------------------------end*/

 

参考文章:https://blog.csdn.net/weixin_44135807/article/details/101204190?depth_1-utm_source=distribute.pc_relevant.none-task&utm_source=distribute.pc_relevant.none-task


推荐阅读
author-avatar
wangyongjieyexuying677
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有