abstrakt：<style>     *{padding: 0;margin: 0;}  /* 先重置一下html，消除HTML標(biāo)簽?zāi)J(rèn)的內(nèi)外邊距 */     .wrap{width: 800px;margin: 0 auto;}

<style>
    *{padding: 0;margin: 0;}  /* 先重置一下html，消除HTML標(biāo)簽?zāi)J(rèn)的內(nèi)外邊距 */
    .wrap{width: 800px;margin: 0 auto;}    /* 對導(dǎo)航的內(nèi)容設(shè)置一個主體為800px的寬并使其居中 */
    .clear{clear: both;}  /* 清除浮動 */
    a{text-decoration-line: none;}   /* 去掉默認(rèn)a標(biāo)簽的下劃線 */
    ul,li{list-style: none;}
    nav .level>li{float: left;width: 16.66%;text-align: center;background: bisque;padding: 10px 0;font-size: 16px;}
    nav .level>li a{color: black;}
    nav .level>li:hover{background: red;}   /* 設(shè)置鼠標(biāo)滑過后的樣式 */
 
    nav .two{display: none;}  /* 先使二級菜單的內(nèi)容隱藏 */
    nav .level>li:hover .two{display: block;}   /* 鼠標(biāo)滑過一級菜單后的顯示二級菜單 */
</style>
<nav>
        <ul class="level">
            <li><a href="">首頁</a></li>
            <li>
                <a href="">欄目1</a>
                <ul class="two">
                    <li>二級菜單1</li>
                    <li>二級菜單2</li>
                    <li>二級菜單3</li>
                </ul>
            </li>
            <li>
                <a href="">欄目2</a>
                <ul class="two">
                    <li>二級菜單4</li>
                    <li>二級菜單5</li>
                    <li>二級菜單6</li>
                </ul>
            </li>
            <li>
                <a href="">欄目3</a>
                <ul class="two">
                    <li>二級菜單7</li>
                    <li>二級菜單8</li>
                    <li>二級菜單9</li>
                </ul>
            </li>
            <li>
                <a href="">欄目4</a>
                <ul class="two">
                    <li>二級菜單10</li>
                    <li>二級菜單11</li>
                    <li>二級菜單12</li>
                </ul>
            </li>
            <li>
                <a href="">欄目5</a>
                <ul class="two">
                    <li>二級菜單13</li>
                    <li>二級菜單14</li>
                    <li>二級菜單15</li>
                </ul>
            </li>
        </ul>
    </nav>

Korrigierender Lehrer：天蓬老師Korrekturzeit：2019-05-15 13:35:09
Zusammenfassung des Lehrers：三級下拉菜單 , 有很多應(yīng)用場景的, 也有很多實(shí)現(xiàn)方法