如何更改滚动条的样式

Question

我有一个css代码喜欢

  .scrollPanel
    {
        height: 100px;
        width: auto;
        position: absolute;
        overflow: scroll;
    }

你可以看到我的例子Here！ 我想知道的是如何改变滚动条的样式？
如何设置CSS样式？

Answer 1

截至目前，没有跨浏览器解决方案只能使用CSS更改滚动条，或者您可以使用jQuery来设置样式。

仅限webkit浏览器的解决方案

Demo

::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}

Credits

Answer 2

您可以使用IE的样式元素完成Alien先生的webkit解决方案，但我知道目前为止的颜色。 Here is the documentation about it

如前所述，目前还没有针对所有浏览器的CSS解决方案。