[网站优化]如何通过CSS3重置修改网站浏览器默认的滚动条样式

开通VIP,畅享全站资源免费下载!

【摘要】 优选资源网小编看到很多Emlog站长,其实不只是Emlog网站,还有一些比如WordPress博客,Zblog博客等等这些个人站长博客,在访问他们的网站时候,发现浏览器的默认滚动条非常不好看,其实,如...

优选资源网小编看到很多Emlog站长,其实不只是Emlog网站,还有一些比如WordPress博客,Zblog博客等等这些个人站长博客,在访问他们的网站时候,发现浏览器的默认滚动条非常不好看,其实,如果对于CSS3非常熟悉的站长就知道该如何重置浏览器默认的滚动条样式。

优选资源网_20200215203107.jpg

今天小编就简单告诉大家如何操作

各位站长,找到您博客对应的网站模板文件中的主要CSS文件(以.css结尾),例如常用的app.cssmain.css

直接在这些文件中的最顶部(文件内容头部),添加如下CSS代码即可:
::-webkit-scrollbar-thumb{background-color:#3385ff; -webkit-border-radius:4px; /*border: 2px solid #fff; */}
::-webkit-scrollbar-thumb:hover{background-color:#0566f7;}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track-piece{background-color:#fff; -webkit-border-radius:0;}
这些代码其实就是CSS3中的伪类,现在的现代浏览器早已支持了,当然如果还有人在使用远古IE浏览器,那就没有办法了!

今天的建站优化教程就到这里了,更多Emlog或博客建站优化小技巧,都可以关注优选资源网哦,小编感激不尽!
版权声明:《 [网站优化]如何通过CSS3重置修改网站浏览器默认的滚动条样式 》为作者优选资源网原创文章,转载请注明原文地址!
最后编辑:2020-2-15 13:02:17
分享到:
赞(2)
发表评论 / Comment

用心评论~

金玉良言 / Appraise
NY_LV1游客
2020-02-17 11:04
火狐也不支持。。