css修改浏览器滚动条

生来就可爱ヽ(ⅴ<●) 提交于 2020-01-19 14:18:02
<body class='scrollbar'>
</body>
.scrollbar{
  /*三角箭头的颜色*/
  scrollbar-arrow-color: #fff;
  /*滚动条滑块按钮的颜色*/
  scrollbar-face-color: #cdcdcd;
  /*滚动条整体颜色*/
  scrollbar-highlight-color: #cdcdcd;
  /*滚动条阴影*/
  scrollbar-shadow-color: #cdcdcd;
  /*滚动条轨道颜色*/
  scrollbar-track-color: #515151;
  /*滚动条3d亮色阴影边框的外观颜色——左边和上边的阴影色*/
  scrollbar-3dlight-color:#cdcdcd;
  /*滚动条3d暗色阴影边框的外观颜色——右边和下边的阴影色*/
  scrollbar-darkshadow-color: #cdcdcd;
  /*滚动条基准颜色*/
  scrollbar-base-color: #cdcdcd;
}
/* chrome & safari 浏览器 */
/*滚动条整体部分,必须要设置*/
.scrollbar::-webkit-scrollbar{
  width: 0px;
  height: 0px;
  background-color: #cdcdcd;
}
/*滚动条的轨道*/
.scrollbar::-webkit-scrollbar-track{
  background-color: #cdcdcd;
}
/*滚动条的滑块按钮*/
.scrollbar::-webkit-scrollbar-thumb{
  border-radius: 0;
  background-color: #515151;
  /* box-shadow: inset 0 0 5px #515151; */
}
/*滚动条的上下两端的按钮*/
.scrollbar::-webkit-scrollbar-button{
  height: 0;
  background-color: #cdcdcd;
}
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!