且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

如何使用css更改滚动条颜色

更新时间:2023-01-05 18:11:32

webkit的属性,可以进入 shadow DOM

You can use the following attributes for webkit, which reach into the shadow DOM:

::-webkit-scrollbar              { /* 1 */ }
::-webkit-scrollbar-button       { /* 2 */ }
::-webkit-scrollbar-track        { /* 3 */ }
::-webkit-scrollbar-track-piece  { /* 4 */ }
::-webkit-scrollbar-thumb        { /* 5 */ }
::-webkit-scrollbar-corner       { /* 6 */ }
::-webkit-resizer                { /* 7 */ }

根据此页面的代码解释问题,工作小提琴与红色滚动条。

Here's a working fiddle with a red scrollbar, based on code from this page explaining the issues.

http://jsfiddle.net/hmartiro/Xck2A/1/

使用此和您的解决方案,您可以处理除Firefox以外的所有浏览器,此时我认为仍需要一个javascript解决方案。

Using this and your solution, you can handle all browsers except Firefox, which at this point I think still requires a javascript solution.