怎樣在Wordpress導(dǎo)航上添加自定義圖標(biāo),讓菜單欄更加引人注目,帶來更多關(guān)注呢?下面分享一下自定義CSS樣式的方式和代碼。(本方法由網(wǎng)友Taokeplus提供,感謝他的熱心分享)
先看效果:
首選,找到菜單找到CSSS類,填寫daohang。
其次,自定義CSS輸入以下代碼,方法:外觀-自定義。
CSS類代碼如下:
.menu-item.daohang:after {
background-color: red;
border-radius: 3px;
color: #fff;
content: “熱”;
font-size: 10px;
line-height:1;
padding: 1px 3px;
position: absolute;
right: -1px;
top: 12px;
}
.kx-meta .fa-qq {
display: inline-block;
width: 22px;
height: 22px;
line-height: 22px;
text-align: center;
color: #fff;
background: #aaa;
border-radius: 3px;
vertical-align: top;
cursor: pointer;
}
.menu-item.daohang:after {
background-color: red;
border-radius: 3px;
color: #fff;
content: “熱”;
font-size: 10px;
line-height:1;
padding: 1px 3px;
position: absolute;
right: -1px;
top: 12px;
}
最后,網(wǎng)站的導(dǎo)航上是不是有一個(gè)小圖標(biāo)呢?你也可以自定義文字,在CSS里面的代碼把文字替換復(fù)制上去就可以了。
有同學(xué)反饋說效果不出來,請大家直接下載這個(gè)TXT文檔吧,就不會(huì)出問題了。
下載導(dǎo)航圖標(biāo)本文介紹Wordpress導(dǎo)航圖標(biāo)設(shè)置方法到此結(jié)束,喜歡的朋友留言點(diǎn)贊分享。轉(zhuǎn)載一定要保留原文出處。http://m.fpfocvy.com.cn/jianzhan/wordpress/3247.html
免責(zé)聲明:網(wǎng)所有文字、圖片、視頻、音頻等資料均來自互聯(lián)網(wǎng),不代表本站贊同其觀點(diǎn),內(nèi)容僅提供用戶參考,若因此產(chǎn)生任何糾紛,本站概不負(fù)責(zé),如有侵權(quán)聯(lián)系本站刪除!郵箱:207985384@qq.com http://m.fpfocvy.com.cn/jianzhan/3247.html



支持感謝
官方的這個(gè)教程也不錯(cuò)哦。
https://www.wpcom.cn/question/436.html