亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

HTML+CSS實(shí)現(xiàn)簡單下拉菜單效果

  發(fā)布時(shí)間：2017-06-22 11:02:38   作者：佚名   我要評論
使用Html+css實(shí)現(xiàn)簡單的下拉菜單代碼非常簡單，具有參考借鑒價(jià)值，需要的的朋友參考下吧

使用Html+css實(shí)現(xiàn)簡單的下拉菜單代碼非常簡單，需要的的朋友參考下吧：

代碼：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    
<html xmlns="http://www.w3.org/1999/xhtml">    
<head>    
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
<title>下拉框</title>    
<style type="text/css">    
*{ margin:0px; padding:0px;}    
#nav{ width:600px; height:40px; margin:0 auto;}    
#nav ul{ list-style:none;}    
#nav ul li{ float:left; line-height:40px; text-align:center; position:relative;}    
#nav ul li a{ text-decoration:none; color:#000; display:block;padding:0px 10px;}    
#nav ul li a:hover{ color:#FFF; background:#333}    
#nav ul li ul{ position:absolute; display:none;}    
#nav ul li ul li{ float:none; line-height:30px; text-align:left;}    
#nav ul li ul li a{ width:100%;}    
#nav ul li ul li a:hover{ background-color:#06f;}    
#nav ul li:hover ul{ display:block}    
</style>    
</head>    
<div id="nav">    
    <ul>    
        <li><a href="#">首頁</a></li>    
        <li><a href="#">學(xué)習(xí)中心</a>    
            <ul>    
                <li><a href="#">java</a></li>    
                <li><a href="#">jQuery</a></li>    
                <li><a href="#">C++</a></li>    
                <li><a href="#">C語言</a></li>    
            </ul>            
        </li>    
        <li><a href="#">個(gè)人中心</a></li>    
        <li><a href="#">關(guān)于我們</a></li>    
    </ul>    
</div>    
<body>    
</body>    
</html>

效果圖：
 

圖1
 

圖2

以上所述是小編給大家介紹的HTML+CSS實(shí)現(xiàn)簡單下拉菜單效果，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！

相關(guān)文章

  • js+css3制作下拉城市菜單多選代碼

    基于css3制作圓形下拉框，點(diǎn)擊滑動(dòng)展開收縮城市菜單，支持多選/勾選城市效果。這是一款實(shí)用的下拉菜單選擇代碼。非常不錯(cuò)，感興趣的朋友前來下載使用
    2019-05-28

  • CSS中的導(dǎo)航欄和下拉菜單的實(shí)現(xiàn)

    這篇文章主要介紹了CSS中的導(dǎo)航欄和下拉菜單的實(shí)現(xiàn)的相關(guān)資料，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2018-07-18

  • HTML+CSS實(shí)現(xiàn)下拉菜單的實(shí)現(xiàn)

    這篇文章主要介紹了HTML+CSS實(shí)現(xiàn)下拉菜單的實(shí)現(xiàn)的相關(guān)資料,小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2018-07-18

  • 純CSS實(shí)現(xiàn)的大型下拉菜單的示例代碼

    下拉菜單在很多網(wǎng)頁中都能應(yīng)用到，這篇文章主要介紹了純CSS實(shí)現(xiàn)的大型下拉菜單的示例代碼的相關(guān)資料，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編
    2018-05-03

  • 純CSS實(shí)現(xiàn)下拉菜單的示例代碼

    這篇文章主要介紹了純CSS實(shí)現(xiàn)下拉菜單的示例代碼，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2018-01-09

  • 純css3制作鼠標(biāo)懸停波浪形狀彈性下拉菜單特效源碼

    純css3制作鼠標(biāo)懸停波浪形狀彈性下拉菜單特效源碼，當(dāng)鼠標(biāo)懸停波浪形菜單欄，彈出列表信息，鼠標(biāo)離開自動(dòng)收縮。效果非常逼真，本段代碼可以在各個(gè)網(wǎng)頁使用，有需要的朋友可
    2017-12-18

  • 純CSS+HTML大型下拉菜單特效

    這是一個(gè)使用HTML和純CSS代碼來制作的大型下拉菜單效果。適合用于欄目分類較多的網(wǎng)站使用，歡迎下載
    2017-10-26

  • 利用純css做一個(gè)下拉菜單功能的示例代碼

    這篇文章主要介紹了利用純css做一個(gè)下拉菜單功能的示例代碼,本文給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
    2020-09-01

最新評論