css3自定义滚动条样式，调整ie浏览器滚动条样式

//webkit浏览器滚动条样式调整
.box{ width: 300px; height: 200px; overflow-y: auto; }
.box::-webkit-scrollbar { width: 8px;  }
.box::-webkit-scrollbar-track { background-color: #eeeeee;  border-radius: 4px; }
.box::-webkit-scrollbar-thumb { border-radius: 4px;  background-color: #d3d3d3; }

//ie浏览器滚动条样式调整
.box{ width: 300px; height: 200px; overflow-y: auto; 
scrollbar-arrow-color: #fff; /*图6,三角箭头的颜色*/
scrollbar-face-color: #dfdfdf; /*图5,立体滚动条的颜色*/
scrollbar-3dlight-color: #dfdfdf; /*图1,立体滚动条亮边的颜色*/
scrollbar-highlight-color: #dfdfdf; /*图2,滚动条空白部分的颜色*/
scrollbar-shadow-color: #E3E3E3; /*图3,立体滚动条阴影的颜色*/
scrollbar-darkshadow-color: #dfdfdf; /*图4,立体滚动条强阴影的颜色*/
scrollbar-track-color: #eee; /*图7,立体滚动条背景颜色*/
scrollbar-base-color:#E3E3E3; /*滚动条的基本颜色*/

//手机端H5滚动条
.guize_content::-webkit-scrollbar-track-piece {
  background-color: #fff;
  border: 1px solid #d4c9b6;
  border-radius: 2px;
}
.guize_content::-webkit-scrollbar {
  width: 4px;
  height: 13px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}
.guize_content::-webkit-scrollbar-thumb {
  background-color: #9f7d52;
  background-clip: padding-box;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  min-height: 28px;
}
.guize_content::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}
}