『WordPress』添加侧边彩色滚动条代码
wordpress默认的浏览器侧边栏滚动条是非常丑陋的,当然,有些WordPress主题是自带美化的侧边滚动栏不需要我们自己去美化,有些WordPress主题是没有美化侧边滚动栏的,那么这时就需要我们去美化啦!今天就教大家如何自定义美化侧边滚动栏。其实非常简单,只需一句代码的事情就可以自定义美化WordPRess侧边滚动栏,并且知识兔代码适用于绝大多数WordPress主题。
一般主题都会自带(自定义代码)这样主题设置的,只需在主题设置自定义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;} 彩色滚动条代码: ::-webkit-scrollbar {width: 10px;height: 1px;}::-webkit-scrollbar-thumb {background-color: #12b7f5;background-image: -webkit-linear-gradient(45deg, rgba(255, 93, 143, 1) 25%, transparent 25%, transparent 50%, rgba(255, 93, 143, 1) 50%, rgba(255, 93, 143, 1) 75%, transparent 75%, transparent);}::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);background: #f6f6f6;}
[字段:登录查看]
下载仅供下载体验和测试学习,不得商用和正当使用。