CSS ::-webkit-scrollbar伪类选择器

关键词

伪类选择器

CSS ::-webkit-scrollbar伪类选择器

WebKit内核的浏览器支持一个特殊的伪元素::-webkit-scrollbar，允许开发者针对滚动条进行样式设计。下面是一些可自定义属性：

width：滚动条宽度
height：滚动条高度
background-color：滚动条背景色
border：滚动条边框
border-radius：滚动条圆角
scrollbar-track-color：滚动条轨道颜色
scrollbar-thumb-color：滚动条滑块颜色

以下示例代码将自定义滚动条的样式设置为绿色圆形：

::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  border-radius: 10px;
  background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: #4CAF50;
}

效果图如下：

本文链接：http://task.lmcjl.com/news/2704.html

展开阅读全文

上一篇：用jQuery实现分页插件的方法下一篇：使用jQuery插件mCustomScrollbar自定义滚动条

热门文章排行

推荐文章

关键词

CSS ::-webkit-scrollbar伪类选择器