css - 找不到 CSS 下拉菜单的问题

Question

我已经查看了关于该主题的所有问题，但没有发现我的编码有任何问题。我需要另一个人的眼睛来找出问题所在。一定有一些我没有看到的东西，因为我之前已经成功制作了下拉菜单...

这是我的菜单的 html5 代码:

<nav id="menu">
<ul>
    <li><a href="index.html" class="currentnew">Home</a></li>
    <li><a href="biography.html">Biography</a></li>
    <li><a href="artwork.html">Artwork</a></li>
        <ul>
            <li><a href="paintings.html">Paintings</a></li>
            <li><a href="drawings.html">Drawings</a></li>
            <li><a href="sculpture.html">Sculpture</a></li>
            <li><a href="viewall.html">View All</a></li>
        </ul>
    <li><a href="exhibitions.html">Exhibitions</a></li>
    <li><a href="commissions.html">Commissions</a></li>
</ul>
</nav>

这是我试图制作下拉菜单的 CSS 样式:

/**** Main Menu ****/

#menu {
background-image: url(../images/paintbanner.png);
height: 55px;
width: 793px;
margin-left:125px;
margin-top: -25px;
}

#menu ul a {
color: #f7f5f1;
}

#menu ul a:hover {
color: #635ccb;
}

#menu ul {
margin-left: 75px;
}

#menu ul li {
float: left;
margin-right: 60px;
font-family: "Bell MT",
             serif;
font-size: 1.1em;
margin-top: 20px;
}

#menu ul ul {
display: none;
position: absolute;
}

#menu ul li:hover > ul {
display: block;
}

#menu ul ul li {
float: none;
margin-top: 0;
margin-right: 0;
position: relative;
background-image: url(../images/dropdown.png);
height: 100%;
width: 120px;
}

#menu ul ul a {
color: #1e1b1b;
font-size: .9em;
}

Answer 1

您关闭了一个 <li>在我认为你是故意的之前。看这里:

<li><a href="artwork.html">Artwork</a></li>
        <ul>
            <li><a href="paintings.html">Paintings</a></li>
            <li><a href="drawings.html">Drawings</a></li>
            <li><a href="sculpture.html">Sculpture</a></li>
            <li><a href="viewall.html">View All</a></li>
        </ul>

应该是:

<li>
        <a href="artwork.html">Artwork</a>
        <ul>
            <li><a href="paintings.html">Paintings</a></li>
            <li><a href="drawings.html">Drawings</a></li>
            <li><a href="sculpture.html">Sculpture</a></li>
            <li><a href="viewall.html">View All</a></li>
        </ul>
</li>