今天我为大家分享B2主题导航菜单用户菜单毛玻璃特效,非常漂亮,大家赶紧试试吧。
代码放入style.css样式文件
/*用户小菜单毛玻璃*/ .top-user-box-drop.show{ visibility: visible; transform: perspective(1px) scale(1); transition-duration: 0s,0.2s,0.2s; background: inherit; backdrop-filter: blur(50px); opacity: 1; } .top-user-box-drop li a:hover{ font-weight: 600; background: inherit; color:#FF0000; } .top-user-info-box{ background: #f4faff; background-position: center; background-size: cover; background-repeat: no-repeat; position: relative; background: inherit; backdrop-filter: blur(50px); opacity: 1; } .top-user-info-box .user-w-rw a span{ font-size: 12px; color:#FF0000; } .top-user-info-box .user-w-gold a i{ color:#FF0000; } .top-user-info-box .user-w-gold a{ color:#FF0000; padding: 0; border: 0; display: inline-block; width: auto; font-size: 13px; display: flex; align-items: center; } .top-user-box-drop.jt::before,.top-user-box-drop.jt::after{ right:28px; left:initial; border-bottom: 8px solid #F5F6F7; z-index: 2; top:-8px; background: inherit; backdrop-filter: blur(50px); opacity: 1; } /*导航毛玻璃*/ .top-style-blur { background: inherit; backdrop-filter: blur(50px); opacity: 1; } .sub-menu { background: inherit; backdrop-filter: blur(50px); opacity: 1; }欢迎访问秀主题博客,分享简单实用WP教程