滚动条

2021-05-24  本文已影响0人  码农界四爷__King
body {

  /*scrollbar-arrow-color: #9e1068; !*上下按钮上三角箭头的颜色*!*/
  scrollbar-face-color: #CBCBCB; /*滚动条凸出部分的颜色*/
  scrollbar-3dlight-color: #00b692; /*滚动条亮边的颜色*/
  /*scrollbar-highlight-color: #333; !*滚动条空白部分的颜色*!*/
  scrollbar-shadow-color: yellow; /*滚动条阴影的颜色*/
  scrollbar-darkshadow-color: green; /*滚动条强阴影的颜色*/
  scrollbar-track-color: #eee; /*滚动条背景颜色*/
  scrollbar-base-color: #e2e2e2; /*滚动条的基本颜色*/
}

::-webkit-scrollbar { /* 滚动条整体部分 */
  width: 2px;
  margin-right: 2px
}

::-webkit-scrollbar-button { /* 滚动条两端的按钮 */
  width: 0;
  height: 0;
}

::-webkit-scrollbar:horizontal {
  height: 2px;
  margin-bottom: 2px
}

::-webkit-scrollbar-track { /* 外层轨道 */
  border-radius: 0;
}

::-webkit-scrollbar-track-piece { /*内层轨道,滚动条中间部分 */
  background-color: #000000;
  border-radius: 0;
}

::-webkit-scrollbar-thumb { /* 滑块 */
  width: 2px;
  border-radius: 0;
  /*background: var(--base-color);*/
  background-color: #FFFFFF40;

}

::-webkit-scrollbar-corner { /* 边角 */
  width: 0;
  /*background-color: red;*/
}

::-webkit-scrollbar-thumb:hover { /* 鼠标移入滑块 */
  background-color: #FFFFFF80;
}
上一篇 下一篇

猜你喜欢

热点阅读