①火狐支持:
scrollbar-color: auto | 滑杆颜色 轨道颜色;
scrollbar-width: auto | thin | none;
②Chrome 支持:
::-webkit-scrollbar:整个滚动条,可以设置任意的尺寸大小,包括 0,也就是滚动条不可见;
::-webkit-scrollbar-button:滚动条按钮,就是顶部和底部有小箭头的那个按钮;
::-webkit-scrollbar-thumb:可拖拽的那个滑杆;
::-webkit-scrollbar-track:滚动条的轨道;
::-webkit-scrollbar-track-piece:部分轨道,这个不太常用,指未被滚动的区域;
::-webkit-scrollbar-corner:滚动的底部角落,出现在水平滚动条和垂直滚动条同时出现的时候,平常滚动条自定义不会用到这个;
::-webkit-resizer:这个是 textarea 文本域默认右下角的缩放条,或者 overflow 不是 visibile 同时设置 resize 属性的元素右下角的拖拽拖动条;
③scrollbar-gutter:auto | stable && both-edges?;
④auto:就是默认的表现。没有滚动条的时候,内容尽可能占据宽度,有了滚动条,可用宽度减小;⑤stable:如果 overflow 属性计算值不是 visible,则提前预留好空白区域,这样滚动条出现的时候,整个结构和布局都是稳定的;⑥both-edges:这个是让左右两侧同时预留好空白区域,目的是让局部绝对居中对称;
(参考:www.zhangxinxu.com/wordpress/2…