当前位置:空木白博客 > WordPress > 正文
空木白

作者:空木白

手机扫码查看

WordPress网站博客页面右侧鼠标滚动条样式

这里我们只需要修改一下css即可自定义网站右侧滚动条啦,样式效果,也就是本站正在使用的样式。这里先让我们看看代码吧

/*—滚动条默认显示样式–*/
::-webkit-scrollbar-thumb{
background-color:#018EE8;
height:50px;
outline-offset:-2px;
outline:2px solid #fff;
-webkit-border-radius:4px;
border: 2px solid #fff;
}

/*—鼠标点击滚动条显示样式–*/
::-webkit-scrollbar-thumb:hover{
background-color:#FB4446;
height:50px;
-webkit-border-radius:4px;
}
/*—滚动条大小–*/
::-webkit-scrollbar{
width:8px;
height:18px;
}

/*—滚动框背景样式–*/
::-webkit-scrollbar-track-piece{
background-color:#fff;
-webkit-border-radius:0;
}

上面代码加入到我们当前 WordPress 主题的 mian.css 即可,如果您是其他网站源码,直接加入到本站源码调用的css即可。

 您阅读这篇文章共花了: 
未经允许不得转载:

作者:空木白, 转载或复制请以 超链接形式 并注明出处 空木白博客
原文地址:《WordPress网站博客页面右侧鼠标滚动条样式》 发布于2018-11-19

分享到:
赞(0) 打赏

评论 抢沙发

评论前必须登录!

  注册



觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

隐藏
变装
EA PLAYER &

历史记录 [ 注意:部分数据仅限于当前浏览器 ]清空

      00:00/00:00
      切换注册

      登录

      忘记密码 ?

      您也可以使用第三方帐号快捷登录

      Q Q 登 录
      微 博 登 录
      切换登录

      注册