::-webkit-scrollbar
时间: 2023-08-30 20:08:46 浏览: 227
Vue的el-scrollbar实现自定义滚动
::-webkit-scrollbar 是一个用于自定义滚动条样式的伪类选择器,它仅在使用WebKit引擎的浏览器中生效,如Chrome、Safari等。
通过使用 ::webkit-scrollbar 可以修改滚动条的样式,例如颜色、宽度、边框、圆角等。下面是一些常用的属性:
- ::-webkit-scrollbar: 选择整个滚动条。
- ::-webkit-scrollbar-thumb: 选择滚动条上拖动块的部分。
- ::-webkit-scrollbar-track: 选择滚动条上的轨道部分。
- ::-webkit-scrollbar-button: 选择滚动条上的按钮部分。
你可以为这些伪类选择器设置不同的样式属性来自定义滚动条的外观。例如,可以使用 background-color 属性来设置滚动条的背景颜色,使用 width 属性来设置滚动条的宽度等。
需要注意的是,虽然 ::-webkit-scrollbar 可以在某些浏览器中使用,但并不是所有浏览器都支持这个伪类选择器。因此,在使用时需要考虑兼容性问题,并提供备用的滚动条样式。
阅读全文