css 滚动条样式修改以及动态显示

限定高度并overflow：auto时，溢出滚动时，滚动条出现，对滚动条的样式修改，并只有当鼠标经过时才显示，代码如下

.plan::-webkit-scrollbar {
  transition: all 1000ms;
  width: 10px;
  background-color: #fff;
}
.plan::-webkit-scrollbar-thumb {
  background-color: transparent;
}
.plan:hover ::-webkit-scrollbar-track-piece {
  /*鼠标移动上去再显示滚动条*/
  background-color: #fff;
  border-radius: 6px;
}
.plan:hover::-webkit-scrollbar-thumb:hover {
  background-color: #c0cecc;
}
.plan:hover::-webkit-scrollbar-thumb:vertical {
  background-color: #c0cedc;
  border-radius: 6px;
  outline: 2px solid #fff;
  outline-offset: -2px;
  border: 2px solid #fff;
}