wordpress菜單ri主題菜單美化

2022-11-23 發(fā)布在 wordpress0

首先復(fù)制以下css 內(nèi)容到/ripro/assets/css/diy.css里


/*導(dǎo)航菜單圖 開始*/
.cc {
display: inline-block;
transform: translateY(-12px);
    font-size: .75rem;
    letter-spacing: 0.05em;
background: linear-gradient(to top, #efd3b0 0%, #f9e1be 100%);
    color: #ffffff;
    border-radius: 1rem;
    padding: .15rem .275rem;
    line-height: 1;
    font-weight: bold;
}

.zz {
    display: inline-block;
    transform: translateY(-12px);
    font-size: .75rem;
    letter-spacing: 0.05em;
    background: linear-gradient(to top, #f308a0 0%, #fb0655 100%);
    color: #ffffff;
    border-radius: 1rem;
    padding: .15rem .275rem;
    line-height: 1;
    font-weight: bold;
}

/*菜單標(biāo)簽美化*/
.ff {
display: inline-block;
transform: translateY(-12px);
    font-size: .75rem;
    letter-spacing: 0.05em;
background: linear-gradient(to right, #6454ef 0%, #3021ec 100%);
    color: #ffffff;
    border-radius: 1rem;
    padding: .15rem .275rem;
    line-height: 1;
    font-weight: bold;
}
/*菜單標(biāo)簽美化結(jié)束*/

然后到主題下面的菜單設(shè)置里，在你的菜單名字后面添加上你需要的代碼，如下

下面只列舉3個，在你的菜單名字后面添加上下面其中一個代碼即可

<span class="cc">真香</span>          <span class="zz">更新中</span>          <span class="ff">免費</span>

如需添加多個只需在CSS里加下面一段代碼即可，標(biāo)簽名自定義必須改否則沖突會導(dǎo)致不知名錯誤錯位等！

.gg { display: inline-block; transform: translateY(-12px); font-size: .75rem; letter-spacing: 0.05em; background: linear-gradient(to top, #efd3b0 0%, #f9e1be 100%); color: #ffffff; border-radius: 1rem; padding: .15rem .275rem; line-height: 1; font-weight: bold; }

同上在你的菜單名字后面添加上下面其中一個代碼即可

<span class=”gg”>增加的</span>

如果您的問題還未解決可以聯(lián)系站長付費協(xié)助。加入我們

有問題可以加入技術(shù)QQ群一起交流學(xué)習(xí)
本站vip會員請加入無憂模板網(wǎng) VIP群（50604020） PS:加入時備注用戶名或昵稱
普通注冊會員或訪客請加入無憂模板網(wǎng) 技術(shù)交流群（50604130）
客服微信號：15898888535
聲明：本站所有文章資源內(nèi)容，如無特殊說明或標(biāo)注，均為采集網(wǎng)絡(luò)資源。如若內(nèi)容侵犯了原著者的合法權(quán)益，可聯(lián)系站長刪除。

導(dǎo)航 css 復(fù)制 wordpress 美化主題菜單內(nèi)容