WordPress主题头部改版雾面半透明菜单导航代码

看到了其他网站有的头部导航菜单雾面效果挺好,就自己研究了一下,很简单给头部加个css样式代码调用就可以了,把以下代码放入你主题的diy.css里,css代码如下

.frosted {background-color: rgba(255,255,255,0.7); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);}

0.7是透明数值自行修改,20px是模糊宽度自行修改想要的数值

再把这段调用代码加入头部菜单文件中/ themes / 主题的/ parts /navbar.php,代码如下

<?php if (_cao('site_logo_text')) : ?>frosted<?php endif; ?>

把这段代码放置header class=”site-header 后面 “> 如图

WordPress主题头部改版雾面半透明菜单导航代码插图

保存后查看效果,根据这个教程你可以改其他地方菜单雾面效果,修改代码对应位置既可以,自行研究

我的效果图

WordPress主题头部改版雾面半透明菜单导航代码插图(1)

 

①本网站资源来源于网络收集,如有侵权,请联系站长进行删除处理。
② 分享目的仅供大家学习和交流,请不要用于商业用途,否则后果自负。
③ 本站提供的源码、模板、插件等等其他资源,不包含技术服务请大家谅解。
④ 在您的能力范围内,为了大环境的良性发展,请尽可能的选择正版资源。
⑤ 本站资源包如果有密码,统一解压密码:www.rclou.cn


二层楼源码网 » WordPress主题头部改版雾面半透明菜单导航代码
  • 31会员总数(位)
  • 2255资源总数(个)
  • 9本周发布(个)
  • 0 今日发布(个)
  • 93稳定运行(天)