Webkit滚动条宽度更改

时间:2015-02-12 20:18:12

标签: css webkit scrollbar

我正在尝试通过-webkit-scrollbar属性更改滚动条的宽度,但Chrome拒绝它说它是一个未知属性。知道为什么吗?

3 个答案:

答案 0 :(得分:0)

在Chrome中运行良好 - http://jsfiddle.net/sergdenisov/wqr5zxpk/2/

div {
    height: 200px;
    background: #f7f6f5;
    overflow-x: hidden;
    overflow-y: auto;
}

    div::-webkit-scrollbar {
        background: #fff;
        width: 15px;
        height: 15px; 
    }

    div::-webkit-scrollbar-thumb {
        background: #c5c5c5;
    }

答案 1 :(得分:0)

.class::-webkit-scrollbar{ width :6px; } 以上对我有用。我只想在将类“class”添加到元素时才应用宽度。

答案 2 :(得分:0)

您可以更改水平和垂直滚动条的宽度

::-webkit-scrollbar-track
{
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  border-radius: 10px;
  background-color: #F5F5F5;
  overflow-x: auto;
}

::-webkit-scrollbar
{
  width: 6px;
  height: 6px;
  background-color: #F5F5F5;
  overflow-x: auto;
}

::-webkit-scrollbar-thumb
{
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
  background-color: #3c8dbc;
  overflow-x: auto;
}