HTML(CSS) Chromium内核浏览器自定义滑动条
First Post:
Last Update:
Word Count:
Read Time:
Last Update:
Word Count:
292
Read Time:
1 min
::-webkit-scrollbar
滚动条整体部分,其中的属性有width,height,background,border,border-radius(就和一个块级元素一样)等。 其中: width:定义的是纵向滚动条的宽度。不能控制横向滚动条的宽度。 height:定义的是横向滚动条的高度。同理不能控制横向滚动条的高度 - 一个简单的演示1 | ::-webkit-scrollbar { |
::-webkit-scrollbar-button
滚动条两端的按钮,可以用 display:none 让其不显示,也可以添加背景图片,颜色改变显示效果 - 演示1 | ::-webkit-scrollbar-button { |
::-webkit-scrollbar-track
外层轨道,可以用 display:none 让其不显示,也可以添加背景图片,颜色改变显示效果 - 演示1 | ::-webkit-scrollbar-track { |
::-webkit-scrollbar-track-
内层轨道,外层轨道设置了,这个内层轨道也会跟着变::-webkit-scrollbar-thumb
滚动条里的滑块 - 演示1 | ::-webkit-scrollbar-thumb { |