時(shí)間：2023-05-21 23:50:01 | 來(lái)源：網(wǎng)站運(yùn)營(yíng)
時(shí)間：2023-05-21 23:50:01 來(lái)源：網(wǎng)站運(yùn)營(yíng)
微信官網(wǎng)導(dǎo)航欄：本次所用到的背景圖片images：
在線咨詢
在剛才我們把滑動(dòng)門原理了解后，趁熱打鐵，把微信官網(wǎng)導(dǎo)航欄制作下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>微信導(dǎo)航欄</title> <style> * { padding: 0; margin: 0; } li { list-style: none; } body { background: url(images/wx.jpg) repeat-x; } /*這個(gè)地方寫錯(cuò)了 .nav { background: url(images/wx.jpg);*/ .nav a { display: inline-block; height: 33px; background: url(images/to.png) no-repeat; padding-left: 15px; font-size: 14px; line-height: 33px; color: #fff; } .nav a span { display: inline-block; height: 33px; background: url(images/to.png) no-repeat right; padding-right: 15px; } .nav ul li { float: left; padding: 0 5px; } .nav { margin-top: 20px; } </style></head><body> <div class="nav"> <ul> <li> <a href="#"> <span>首頁(yè)</span> </a> </li> <li> <a href="#"> <span>幫助與反饋</span> </a> </li> <li> <a href="#"> <span>公眾平臺(tái)</span> </a> </li> <li> <a href="#"> <span>微信支付</span> </a> </li> <li> <a href="#"> <span>微信廣告</span> </a> </li> <li> <a href="#"> <span>企業(yè)微信</span> </a> </li> <li> <a href="#"> <span>微信開(kāi)放平臺(tái)</span> </a> </li> <li> <a href="#"> <span>微信網(wǎng)頁(yè)版</span> </a> </li> </ul> </div></body></html>效果：.nav a:hover { background: url(images/ao.png); } .nav a:hover span { background: url(images/ao.png) right; } 關(guān)鍵詞：導(dǎo)航
客戶&案例
營(yíng)銷資訊
關(guān)于我們
客戶&案例
營(yíng)銷資訊
關(guān)于我們
微信公眾號(hào)
版權(quán)所有? 億企邦 1997-2025 保留一切法律許可權(quán)利。
