WordPress教程:修改网站的滚动条样式

一、前言
网站近两个月没有更新，一直在为秋季搬家做准备。秋季招聘太累了。等到秋季招聘结束，再慢慢恢复文章更新速度。网站滚动条可以根据自己的喜好改变样式。在所有浏览器中，带有webkit内核的浏览器是最可定制的滚动条。由于源代码开放，市场上基于webkit内核的浏览器很难穷尽。比如:谷歌Chrome、Opera、360至尊浏览器、猎豹浏览器、搜狗浏览器等。

第二，代码部署
这段代码只针对robin主题用户，其他用户需要自行修改对应的style.css文件。显示效果:

用户可以添加代码到外观->主题设置->定制风格->自定义样式里面。

代码：

/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/ 
::-webkit-scrollbar {
    width: 9px;
    height: 9px
}
/*定义滚动条轨道*/ 
::-webkit-scrollbar-track {
    background-color: transparent;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em
}
/*定义滑块 内阴影+圆角*/ 
::-webkit-scrollbar-thumb {
    background-color: #0093ff;
    background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.4) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.4) 50%,rgba(255,255,255,.4) 75%,transparent 75%,transparent);
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em
}

三.摘要
你可以随意改变风格。因为是基于webkit内核的，所以只有webkit内核浏览器可以支持这种风格的显示。IE浏览器不兼容，但现在应该没人用IE了。

更新完一篇文章，我还是继续努力做个测试吧。