html5 NAV TAG正確使用

Question

我已經開始在我的頁面上使用 html 標簽，並且我正在嘗試確定 NAV 標簽的正確用法。 我已經閱讀了文檔，似乎我應該可以接受我所擁有的，但我注意到大多數其他開發人員在“ul”“li”標簽中都有他們的導航“塊”。 我用過div。

我的問題是，使用“ul”“li”標簽而不是 div 的優點/缺點是什么？

以下內容是否適用於導航？

<nav>
    <div id="navBar">
        <div id="navItem1"><a></a></div>
        <div id="navItem2"><a></a></div>
        <div id="navItem3"><a></a></div>
        <div id="navItem4"><a></a></div>
    </div>
</nav>

Answer 1

您發布的代碼不是最佳實踐。 它應該是：

<nav>
    <ul>
        <li><a></a></li>
        <li><a></a></li>
        <li><a></a></li>
        <li><a></a></li>
    </ul>
</nav>

<ul>和<li>標簽比使用div標簽更好，並且幾乎總是用於菜單。 通過使用ul s 和li s，你不會用太多的 ID 阻塞你的代碼。

Answer 2

列表 (ul, ol) 在可訪問的瀏覽器（屏幕閱讀器等）中可以具有其他含義，而 div 則沒有。 這使這些用戶更容易使用您的網站，這也是菜單首選列表的原因之一。

此外，正如其他人所說，列表標簽為內容提供了一些上下文（菜單是鏈接列表），而 div 沒有上下文。

Answer 3

按照慣例，導航欄被認為是鏈接列表，因此是 ul-li。 沒有實際的區別，只是一種常見的做法

你在做什么很好，也許我會直接用 nav#navBar 替換 div#navBar，以降低動畫級別