CSS自定义滚动条样式

  • 内容
  • 评论
  • 相关

将CSS代码放进css文件即可瞬间改变你网站滚动条的样式。~

css代码:

/*---滚动条默认显示样式--*/  
::-webkit-scrollbar-thumb{  
   background-color:#018EE8;  
   height:50px;  
   outline-offset:-2px;  
   outline:2px solid #fff;  
   -webkit-border-radius:4px;  
   border: 2px solid #fff;  
}
/*---鼠标点击滚动条显示样式--*/  
::-webkit-scrollbar-thumb:hover{  
   background-color:#FB4446;  
   height:50px;  
   -webkit-border-radius:4px;  
}
/*---滚动条大小--*/  
::-webkit-scrollbar{  
   width:8px;  
   height:8px;  
}
/*---滚动框背景样式--*/  
::-webkit-scrollbar-track-piece{  
   background-color:#fff;  
   -webkit-border-radius:0;  
}

发表评论

电子邮件地址不会被公开。 必填项已用*标注

评论

3条评论
  1. avatar

    HAOESSAYS Lv.1    美国 回复

    看起来很复杂啊

    1. avatar

      虚无的夏夏 Lv.1    广东省河源市 电信 回复

      萌新瑟瑟发抖

      1. 头像

        小陈    湖南省邵阳市 移动 回复

        回复了虚无的夏夏:什么鬼。

    00:00 / 00:00
    顺序播放