当前位置:奉上博客 » 站长之家 » 正文

7b2主题美化-导航菜单用户菜单毛玻璃特效

代码放入CSS样式:

流程:打开b2后台>点击外观>点击自定义>点击额外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;
	}
/*用户玻璃特效结束*/

相关文章