這篇文章主要介紹css點(diǎn)擊菜單向右展開(kāi)顯示內(nèi)容怎么弄,文中介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們一定要看完!
<!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>css多級(jí)菜單向右展開(kāi)</title> <style> *{margin: 0 auto;padding: 0} .nav-wrapper{width: 100px;} .nav-wrapper ul a{font-family: '微軟雅黑';font-size: 14px;color: #333;text-decoration: none;} .nav-wrapper ul a:hover{color: #000;text-decoration: none;} .nav-wrapper ul li{width: 100px;height: 35px;line-height: 35px;text-align: center;position: relative;} .nav-wrapper ul li:hover{background: #c1c1c1;} .nav-wrapper ul{width: 100px;height: auto;position: absolute;background: #DADADA;list-style: none;} .nav-wrapper .nav1{position: static !important;} .nav-wrapper ul.nav2{left: 99px;top: 0;display: none;} .nav-wrapper .nav1 .li1:hover ul.nav2{display: block;background: #c1c1c1;} </style> </head> <body> <!--代碼部分--> <!-- 歡迎來(lái)到大峽谷 --> <div class="nav-wrapper"> <ul class="nav1"> <li class="li1"><a href="#">一成</a> <ul class="nav2"> <li class="li2"><a href="#">輪子?jì)?lt;/a></li> <li class="li2"><a href="#">維克托</a></li> </ul> </li> <li class="li1"><a href="#">溫bb</a> <ul class="nav2"> <li class="li2"><a href="#">薇恩</a></li> <li class="li2"><a href="#">盲僧</a></li> </ul> </li> <li class="li1"><a href="#">天翔</a> <ul class="nav2"> <li class="li2"><a href="#">鱷魚(yú)</a></li> <li class="li2"><a href="#">小炮</a></li> </ul> </li> <li class="li1"><a href="#">顧研</a> <ul class="nav2"> <li class="li1"><a href="#">火女</a></li> <li class="li1"><a href="#">石頭人</a></li> </ul> </li> </ul> </div> </body> </html>
以上是css點(diǎn)擊菜單向右展開(kāi)顯示內(nèi)容怎么弄的所有內(nèi)容,感謝各位的閱讀!希望分享的內(nèi)容對(duì)大家有幫助,更多相關(guān)知識(shí),歡迎關(guān)注創(chuàng)新互聯(lián)網(wǎng)站制作公司行業(yè)資訊頻道!
分享文章:css點(diǎn)擊菜單向右展開(kāi)顯示內(nèi)容怎么弄-創(chuàng)新互聯(lián)
文章網(wǎng)址:http://aaarwkj.com/article44/gdoee.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供做網(wǎng)站、電子商務(wù)、企業(yè)建站、App設(shè)計(jì)、網(wǎng)站營(yíng)銷、動(dòng)態(tài)網(wǎng)站
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容