WordPress子比主题侧边滚动条样式美化教程

我更新的动力 - 源自您的关注。

------正文内容展示,开始汲取新知识啦------
温馨提示:本文最后更新于2024-05-04 09:58:40,某些文章具有时效性,若有错误或已失效,请在下方留言。

前言

WordPress默认的浏览器侧边栏滚动条是非常丑陋的,当然,有些WordPress主题是自带美化的侧边滚动栏不需要我们自己去美化,有些WordPress主题是没有美化侧边滚动栏的,那么这时就需要我们去美化啦!狐狸站长今天就教大家如何自定义美化侧边滚动栏。其实非常简单,只需一句代码的事情就可以自定义美化WordPress侧边滚动栏,并且代码适用于绝大多数WordPress主题。

演示图

20240504095818247-gundong

 

使用方法

只需在主题设置自定义CSS代码里面添加美化的css代码即可! 如果主题没有 自定义代码 那么在WordPress主题目录文件里找style.css文件或者在WordPress后台里找“外观—>自定义—>额外CSS”里面美化的css代码即可!

单色滚动条样式

/*滚动条显示样式*/
::-webkit-scrollbar-thumb{
background-color:#FF6666; /*更改喜欢的十六进制颜色*/
height:50px;
outline-offset:-2px;
outline:2px solid #fff;
-webkit-border-radius:4px;
border: 2px solid #fff;
}
/*滚动条大小*/
::-webkit-scrollbar{
width:8px;
height:8px;
}
/*滚动框背景样式*/
::-webkit-scrollbar-track-piece{
background-color:#fff;
-webkit-border-radius:0;
}

彩色滚动条样式

------本文内容已结束,喜欢请分享------

感谢您的访问,Ctrl+D收藏本站吧。

五月 20

恬集社的今时往日

  • 吼吼~~~,往年的今天博主不知道跑哪里偷懒去了~~~
© 版权声明
THE END
喜欢就支持一下吧
点赞6赞赏 分享打赏
评论 抢沙发

请登录后发表评论

    暂无评论内容

社区求救信号帮助是一种美德