多个<nav>标签

Question

我们可以在html5中的同一页面上使用多个标签吗？

我在Zeldman.com上看过这篇文章,但对我来说并不完全清楚

即

<header><nav>links here</nav></header>

<footer><nav>links here</nav></footer>

Answer 1

是的,一点没错.你可以有多个header,nav和footer标签sans惩罚.

只要你确保你在语义上使用标签并且你没有把它们放在无效的地方(例如它们是块级元素,所以你不能把它们放在内联元素中),那么你就不应该不要太担心坚持者所说的话.很容易陷入争论微小的细节而不是向前推进你的项目.

Answer 2

是的，拥有多个<nav>元素绝对没问题。

您只需要确保让使用屏幕阅读器的人能够区分它们。您可以通过<nav>使用标记每个来做到这一点aria-label。

<nav aria-label=’primary’>
  <ul>
    ...List on links here...
  </ul>
</nav>
<nav aria-label=’secondary’>
  <ul>
    ...List on links here...
  </ul>
</nav>

或者，如果<nav>屏幕上的可见文本之一可以识别为标签元素，则可以使用aria-labelledby如下所示：

<nav aria-label="Site Menu">
  <ul>
    ...List on links here...
  </ul>
</nav>
<article>
  <h1>Title</h1>
  ...
  <nav aria-labelledby="id-1">
    <h2 id="id-1">
      Related Content
    </h2>
    <ul>
      ...List on links here...
    </ul>
  </nav>
</article>

您可以阅读有关使用多个导航地标的更多信息。

Answer 3

答案是肯定的。<nav>您可以在页脚中添加一个标签，有关更多信息，请查看mdn<nav>文档。