Wie implementiert man ein PHP-Dropdown-Menü und mehrstufige Spalten? (Code tatsächlicher Test)-PHP-Tutorial-php.cn

Wie implementiert man ein PHP-Dropdown-Menü und mehrstufige Spalten? (Code tatsächlicher Test)

藏色散人

Freigeben： 2023-04-03 17:50:02

Original

4433 Leute haben es durchsucht

Bei der Website-Erstellung wird in der Navigationsleiste normalerweise eine Dropdown-Spalte angezeigt. Die PHP-Implementierung dieser Funktion ist nicht so einfach und erfordert eine gewisse Wissensreserve in Bezug auf Datenbanken und PHP. In diesem Artikel wird Ihnen daher auf einfache Weise die funktionale Implementierung des sekundären PHP-Dropdown-Menüs vorgestellt, damit Sie es verstehen und lernen können.

Diese einfache und leicht verständliche Methode wird hauptsächlich durch HTML- und CSS-Code implementiert. Spezifische Beispiele für PHP-Dropdown-Menücode sind wie folgt:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<div id="nav">
    <ul>
        <li><a href="">首页</a></li>
        <li><a href="">笔记本电脑</a>
            <ul>
                <li><a href="#">索尼</a> </li>
                <li><a href="#">联想</a> </li>
            </ul>
        </li>
        <li><a href="">摄像机</a>
            <ul>
                <li><a href="#">松下</a> </li>
                <li><a href="#">佳能</a> </li>
            </ul>
        </li>
        <li><a href="">联系我们</a></li>
    </ul>
</div>
</body>
</html>

Nach dem Login kopieren

style.css Der Code lautet wie folgt:

<style>
        *{margin:0;padding: 0;list-style: none;text-decoration: none;}
        #nav{width: 500px;height: 40px;background: #ccc;margin: 0 auto;}
        ul{background: #aaa}
        ul li{float:left; display:block; height: 40px; line-height: 40px; padding: 0 20px; position: relative;}
        ul li:hover{background: #cea;}
        ul li ul li{float: none;}
        /*关键一：将二级菜单设置为display：none;*/
 ul li ul{position: absolute;top:40px;left: 0; display: none;}
        ul li ul li:hover{background: red;}
        /*关键二：在划过二级菜单从属的一级菜单时，设置为display:block;*/
 ul li:hover ul{display: block;}
    </style>

Nach dem Login kopieren

Wie implementiert man ein PHP-Dropdown-Menü und mehrstufige Spalten? (Code tatsächlicher Test)

Dieser Artikel stellt hauptsächlich vor, wie man das sekundäre PHP-Dropdown-Menü auf einfache Weise implementiert. Ich hoffe, dass es Freunden in Not hilfreich sein wird .

[Empfehlungen für verwandte Inhalte]

Vollständiger Code für das sekundäre Dropdown-Menü der PHP-Entwicklungsnavigationsleiste

Sekundäres Dropdown-Menü der PHP-Entwicklungsnavigationsleiste Down-Menü-HTML-Seite

So lesen Sie die Datenbank mit dem PHP-Dropdown-Menü

PHP und jQuery realisieren den Anzeigeeffekt der drei- Dropdown-Menü der Navigationsleiste auf Ebene

PHP-Entwicklung Navigationsleiste sekundäres Dropdown-Menü CSS-Stil

Das obige ist der detaillierte Inhalt vonWie implementiert man ein PHP-Dropdown-Menü und mehrstufige Spalten? (Code tatsächlicher Test). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!