在<nav>内部使用<ul>有什么原因吗？

Question

我知道新的HTML5 nav元素是用于创建导航菜单的...显然...但每次我看到有人使用它时，他们倾向于在其中放置一个ul，就像这样：

     <nav>
        <ul>
            <li><a href=#>Item A</a></li>
            <li><a href=#>Item B</a></li>
            <li><a href=#>Item C</a></li>
        </ul>
    </nav>

这是必要的吗？有什么优势吗？没有理由只写：

     <nav>
        <a href=#>Item A</a>
        <a href=#>Item B</a>
        <a href=#>Item C</a>
     </nav>

或者说，否则为什么要将ul包装在nav中呢？有什么意义吗？只是为了让您的标记更具“语义化”吗？为什么不单独使用ul呢？

- temporary_user_name

---

语义基本上就是它的核心。<ul>声明了多个彼此独立的选项。 - Brad Christie

这只是某些人的偏好。通常情况下您是正确的，没有必要...但也不是不需要。我大多数时候会单独使用无序列表（UL），而用div代替导航（nav）。 - Cayce K

投票关闭了自己的问题，肯定是重复的，在找到另一个问题之前找不到它。 - temporary_user_name

好文章 - http://html5doctor.com/nav-element/ - Stickers

其中的原因是它添加了结构，可以使用CSS来定位并改变菜单的外观。如果您不需要这样做，那么添加的标记将是多余的。如果您只是因为“应该”而向任何代码添加任何内容，而不是因为您需要，那么您已经偏离了正确的轨道。编写实现目标的代码，而不是为了满足所谓的期望。 - Chris Baker

Answer 1

对于html5来说，讨论它的语义解决方案是一件困难的事情。主要的两个问题是：

导航实际上是一种无序列表。

但是导航也可以更加复杂（包括标题、嵌套的 ul 元素）。因此，nav 元素不能引起 ul 元素（就像 <menu> 元素那样）...

例如：

<nav>
    <h3>Main navigation</h3>
    <ul><li>...</li></ul>
    <a href="registernow.php">Register</a>
    <h4>Sub navigation</h4>
    <ul><li>...</li></ul>
</nav>

在这种情况下，导航比简单的ul要复杂得多。

总结一下：在nav内部，可以有多个列表、多个链接、标题等，还可以包含单个ul。 在css tricks上看一下关于这个问题的热烈讨论。对于这个解决方案，有很多支持和反对的票数...但归根结底，这个解决方案现在是一个语义事实：）。

导航 vs 菜单：<nav> or <menu> (HTML5) 在css tricks上进行了激烈的讨论：https://css-tricks.com/navigation-in-lists-to-be-or-not-to-be/ 导航列表的总结：https://css-tricks.com/wrapup-of-navigation-in-lists/

- Jacek Kowalewski