如何给浏览器设置滚动条样式

 /*覆盖默认滚动条样式*/
 ::-webkit-scrollbar,scrollbar
  {   border-radius: 15px;
      width: 10px;
      height: 130px;
      background-color: #fff;
  }
  /*定义滚动条轨道 内阴影+圆角*/
 ::-webkit-scrollbar-track{
      -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
      border-radius: 10px;
      background-color: #343084;
  }
  /*定义滑块 内阴影+圆角*/
 ::-webkit-scrollbar-thumb{
      border-radius: 10px;
      -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
      background-color: #436dc7;
      width: 10px;
      height: 130px;
  }

这里要注意的是  如果你只是这么写 那么 你整个页面的滚动条都会使用这个样式

那样会很丑  所以 如果你想修改局部的滚动条样式  请在上面的css里  添加限制  比如

 /*覆盖默认滚动条样式*/
 .conentleft ::-webkit-scrollbar,scrollbar
  {   border-radius: 15px;
      width: 10px;
      height: 130px;
      background-color: #fff;
  }
  /*定义滚动条轨道 内阴影+圆角*/
 .conentleft ::-webkit-scrollbar-track{
      -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
      border-radius: 10px;
      background-color: #343084;
  }
  /*定义滑块 内阴影+圆角*/
 .conentleft ::-webkit-scrollbar-thumb{
      border-radius: 10px;
      -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
      background-color: #436dc7;
      width: 10px;
      height: 130px;
  }

这样 所修改的滚动条  就只是 class=‘conentleft’里的滚动条样式了