释放双眼,带上耳机,听听看~!
现在,导航栏已完成重构。但是,根据我们的测试,现存在以下问题:
Chromium 核心(不论版本号)无法启用导航栏子菜单的高斯模糊效果,是普通的半透明。
Safari 和 FireFox 均能正常显示导航栏子菜单的高斯模糊效果。
特别感谢 LiangYin 提出的高斯模糊方案,让我们的子菜单能至少做到这个状态~
以下是实现其功能的源代码,如有小伙伴有建议,请在下方评论区提出哦~
<ul class="Dropdown-menu dropdown-menu Dropdown-menu--right"></ul>
<!--导航栏子菜单容器-->
导航栏子菜单容器
.Dropdown-menu--right {
background-color: rgba(255,255,255,0.67);
-webkit-backdrop-filter: blur(23px); /<em>高斯模糊</em>/
backdrop-filter: blur(23px);
}
/*导航栏子菜单 CSS*/
导航栏子菜单 CSS
Dehoing
![](https://bbs.dehoing.com/wp-content/themes/b2/Assets/fontend/images/default-img.jpg)