html - 为导航子菜单设计 UL

Question

我正在创建一个页面，其中有两个垂直菜单，每个菜单都有一个标题，然后在导航类型链接的正下方。

我正在为两个标题使用 UL，并希望为每个菜单的其余部分使用子 UL。我遇到了一个问题，子 UL 具有父级的属性并且显示内联而不是垂直显示。此外，子菜单链接是缩进的，而不是直接位于标题下方。我在 CSS 方面还很陌生，所以如果我做错了，我非常感谢任何建议。感谢您的帮助

#Contentmenu ul {
    margin: 0; 
    padding: 40px;
    margin-left:auto;
    margin-right:auto;
    width:960px;
    list-style-type: none; 
    list-style-image: none; 
}

#contentmenu li {
    display: inline; 
    padding:10px;  
    float: left;
}

#contentmenu a {
    display:block;
    padding:10px;
    width:200px;
    color:#ffffff;
    font-size:26px;
    background-color:#c7daff;
}


#Contentsubmenu ul {
    margin: 0; 
    margin-left:auto;
    margin-right:auto;
    width:960px;
    list-style-type: none; 
    list-style-image: none; 
}

#contentsubmenu li {
    display:block;
    floa:left;
}

#contentsubmenu a {
    display:block;
    width:200px;
    color:#000000;
    font-size:20px;
    border-bottom:solid;
    border-bottom-width:1px;
    background-color:#ffffff
}

HTML

<div id="contentmenu">
<ul>
    <li><a href="#">Header 1</a>          
    <div id="contentsubmenu">
        <ul>
            <li><a href="#">Article 1</a></li>
            <li><a href="#" Article 2</a></li>
        </ul>
    </div>
    </li>
    <li><a href="#">Articl3</a></li>
</ul>

Answer 1

如果你只想定位到顶级，你可以使用这个:

#contentmenu > ul

和

#contentmenu > ul > li

此外，CSS 区分大小写，因此请确保您使用的是#contentmenu

这是否也解决了您的其他问题？