css 修改滑动条样式

有的时候网页布局中间部分用了overflow: scroll;（当然这种设计是不常见的），当有的时候，一旦中间部分出现滑动条且样式和全局不搭，那视觉效果会大打折扣，但是那一块还必须要有滑动条，这个时候为了满足视觉效果就需要修改修改滑动条样式了，css代码如下：

  ::-webkit-scrollbar

  {

    /*

      width:  y 轴上的滑动条宽度;

      height:  x 轴上的滑动条高度;

    */

    width: 8px;

    height: 8px;

    background-color: #F5F5F5;

  }

  /*定义滚动条轨道 内阴影+圆角*/

  ::-webkit-scrollbar-track

  {

    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);

    border-radius: 6px;

    background-color: #F5F5F5;

  }

  /*定义滑块 内阴影+圆角*/

  ::-webkit-scrollbar-thumb

  {

    border-radius: 6px;

    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);

    background-color: #939393;

  }