-webkit-scrollbar

最新推荐文章于 2024-07-27 02:24:11 发布

weixin_30536513

最新推荐文章于 2024-07-27 02:24:11 发布

阅读量126

点赞数

原文链接：http://www.cnblogs.com/zimin1985/p/3362293.html

版权

-webkit-scrollbar

在IE中可以自定义滚动条的样式，基于webkit的浏览器现在也可以自定义其样式：

::-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 */ }

 1     #tasks::-webkit-scrollbar {
 2             width:6px;
 3             height:6px;
 4             border: none;
 5             background: transparent;
 6     }
 7     #tasks::-webkit-scrollbar-track-piece {
 8             border: none;
 9             position: absolute;
10             padding: 0;
11             box-shadow: none;
12             background-color: rgba(0,0,0,0.17);
13             border-radius: 30px;
14     }
15     #tasks::-webkit-scrollbar-thumb:vertical {
16             background-color: rgba(0,0,0,0.18);
17             border-radius: 30px;
18             border: none;
19     }
20     #tasks::-webkit-scrollbar-thumb:horizontal {
21             background-color: rgba(0,0,0,0.18);
22             border-radius: 30px;
23             border: none;
24     }