使用HTML/CSS的分层列表

我正在尝试创建一个顶级菜单，就像您在大多数应用程序中看到的那样，使用HTML、CSS和Javascript。我知道有很多预建的，但我想创建自己的

----------------------
| File | Edit | Help |
----------------------
| New     |
| Save    |
| Save As |
 ---------

我一直在尝试各种CSS样式，以使下面的列表布局正确。这是合适的HTML结构，还是您会推荐另一种？正确布局菜单需要什么CSS？在这一点上，我并不关心功能

我对任何HTML5技术都持开放态度，因为这只是一个个人项目

<ul>
    <li>File</li>
    <ul>
        <li>New</li>
        <li>Save</li>
        <li>Save As</li>
    </ul>
    <li>Edit</li>
    <ul>
        <li>Cut</li>
        <li>Copy</li>
        <li>Paste</li>
    </ul>
    <li>Help</li>
    <ul>
        <li>About</li>
    </ul>
</ul>

文件

新的
拯救
另存为

编辑

削减
抄袭
粘贴

帮助

关于

请看下面的示例：

---

您的html标记不正确

ul

不能直接位于另一个

ul

内部。它应该位于顶部

ul

的

li

内部。

<ul>
    <li>
        <a href="#">File</a>
        <ul>
            <li><a href="#">New</a></li>
            <li><a href="#">Save</a></li>
            <li><a href="#">Save As</a></li>
        </ul>
    </li>
    <li>
        <a href="#">Edit</a>
        <ul>
            <li><a href="#">Cut</a></li>
            <li><a href="#">Copy</a></li>
            <li><a href="#">Paste</a></li>
        </ul>
    </li>
    <li>
        <a href="#">Help</a>
        <ul>
            <li><a href="#">About</a></li>
        </ul>
    </li>
</ul>