文章目录
  1. 1. 代码
  2. 2. 例子

代码

css自定义滚动条样式,webkit内核浏览器。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
/* 滚动条样式 */
::-webkit-scrollbar {
/* 滚动条的宽度 */
width: 10px;
margin-right: 7px;
}
::-webkit-scrollbar-track {
/* 滚动条的滑轨背景颜色 */
background-color: #fff;
}
::-webkit-scrollbar-thumb {
/* 滑块颜色 */
background-color: #d6d6d6;
border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
/* 鼠标移到滑块上面的变色 */
background-color: #666;
}
::-webkit-scrollbar-button {
/* 滑轨两头的监听按钮颜色 */
background-color: #fff;
}
::-webkit-scrollbar-corner {
/* 横向滚动条和纵向滚动条相交处尖角的颜色 */
background-color: #fff;
}

例子

可以点击此处查看:例子

文章目录
  1. 1. 代码
  2. 2. 例子