html - 语义按钮标记

Question

好奇如何通过 HTML 标记以下内容。不确定它是否是一个列表，是否应该是单独的 div（可能有跨度？）或导航（html 5）。

最左边的按钮是独立的。然后标题居中。然后是一个按钮组（后退/下一个）。然后是最右侧的按钮（通知）。

所有按钮和标题都引用并作用于其下方的内容。

button         Title of page below      button(back) button(next)       button  

Answer 1

如果它是导航并且您希望它是语义的，则应将其包装在nav标签中。该Nav标记仅是 HTML5，但在语义上描述了导航。我会这样构造它：

<nav>
    <ul>
        <li><a href="#">Button</a></li>
        <li><h1>Title</h1></li>
        <li><a href="#">Back</a></li>
        <li><a href="#">Next</a></li>
        <li><a href="#">Button</a></li>
    </ul>
</nav>

使用锚标记进行导航并将它们的样式设置为合适的样式是一种很好的做法。您应该使用 a<h1>作为标题，因为它应该是最重要的标题。