制作导航栏时是否必须使用 <ul>/<ol> 元素？ [关闭]答案

【问题标题】：Do I have to use <ul>/<ol> elements when I make navbars? [closed]制作导航栏时是否必须使用 <ul>/<ol> 元素？ [关闭]
【发布时间】：2014-06-30 20:28:12
【问题描述】：

当我制作导航栏/其他链接组时，我必须使用ul/ol 元素还是可选的？

替换这段代码可以吗

<div>
  <ul style="list-style: none">
    <li style="display: inline-block"><a href="#">fb page</a></li>
    <li style="display: inline-block"><a href="#">twitter account</a></li>
    <li style="display: inline-block"><a href="#">stackoverflow account</a></li>
  </ul>
</div>

通过

<div>
    <a href="#" style="display: inline-block">fb page</a>
    <a href="#" style="display: inline-block">twitter account</a>
    <a href="#" style="display: inline-block">stackoverflow account</a>
</div>

【问题讨论】：

我会坚持使用<ul>。但也可以使用<div> 来完成...
完全取决于您。它是有效的 HTML，尽管在语义上不正确。
无非是常见的做法。随心所欲地构建它。

标签： html list semantics

【解决方案1】：

从结构和理论上讲，菜单是链接列表，因此您的标记应将其反映为链接列表。您可以设置样式以使列表的效果在图形浏览器中不可见。

实际上，结构是有用的。看看如果您没有列表并且您在没有样式表的情况下查看页面会发生什么。你能说出一个链接在哪里结束，下一个链接从哪里开始吗？

【讨论】：

所以，理论上，我不能省略列表标签，即使我想创建一个像我的例子一样的单线性菜单？
如果你想让它有意义就不要。

【解决方案2】：

答案在于使用正确的语义。导航是链接列表，因此我们将其视为列表。 <ul> 和 <ol> 分别代表无序列表和有序列表。 <div> 标签几乎没有语义意义。

【讨论】：

【解决方案3】：

没关系：您可以使用<ul> 或<div>，但<li> 中的实际符号在菜单中不可见。 Rgds，

【讨论】：

【解决方案4】：

简短回答：不，您不必使用它们。

长答案：列表标签（<ul>、<ol>）传统上用于创建可导航菜单，并且有许多可用的样式表可以正确地将它们设置为菜单、下拉菜单等。也就是说，这只是一个常见的（尽管有用的）约定。您必须遵守约定，但如果您这样做，您的生活（更重要的是，任何追随您的开发者的生活）都会变得更轻松。

【讨论】：