Html 如何向这个简单的导航栏添加下拉列表？

抱歉，如果这是一个愚蠢的问题，但我正在寻找添加一个下拉列表的项目到这个导航栏。它位于

navbar.php

文件中，下面是代码：

<link rel="stylesheet" href="/styles/navbar.css" type="text/css" /> <!-- navbar styles -->

<ul id="nav">
    <li><a href="/index.php">Home</a></li>
    <li><a href="/item1/">Item 1</a></li>
    <li><a href="/item2/">Item 2</a></li>
    <li><a href="/item3/">Item 3</a></li>
    <li><a href="/item4/">Item 4</a></li>
</ul>

---

所以我的问题是，有没有一种简单的方法可以将项目的下拉列表添加到“项目4”中？例如，下拉菜单将出现在鼠标上方？

我希望您了解我们是如何做到这一点的，而不是给您鱼。有了鱼竿，你总是可以自己钓鱼

看看我在这把小提琴上做了什么：

实际上是这样的：

nav ul ul {
    display: none;
}

    nav ul li:hover > ul {
        display: block;
    }

你必须隐藏你想要切换的

ul

，如果有人在上面悬停，你必须将其设置为可见

PS：如您所见，我使用了

HTML5

，这是推荐的，因为它（更）具有语义

nav ul ul {
    display: none;
}

    nav ul li:hover > ul {
        display: block;
    }