Question

这似乎是一个非常奇怪的问题，但我现在已经想知道它的答案已经有一段时间了，并且无法在网上找到任何关于它的内容（如果我确实很想念它）。< / p>

无论如何，什么会更多＆＃34;传统＆＃34; html5使用div的方式，但也使用html5语义标记。

<div class="header-wrapper">
    <header>
        <h1>Some header</h1>
    </header>
</div>

以上代码是否会比下面的代码更好的标记？

<header>
    <div class="header-wrapper">
        <h1>Some header</h1>
    </div>
</header>

或者它对以前没有任何影响？或者你最初会在html5语义上添加一个类并完全摆脱div？

p.s这是我的第一篇文章，请让我知道它是否过于宽泛＆＃39;要问的一个问题。

Answer 1

这两种方法都是完全可以接受且有效的标记，因为 <header> element 和 <div> element 支持 flow content 为他们的孩子，两个元素都是流内容。至于哪种方法更为可取，它几乎完全取决于个人偏好。

然而，话说回来，如果你不打算使用两者 <header>和<div class="header-wrapper">，那就有点失败了。除了包装器之外的<header>中的内容（反之亦然）。什么是更好的选择是只使用一个标签。

从技术角度选择<header>元素将是一个更好的选择，因为元素名称描述其中的代码应该包含文档的标题，可以更容易地阅读和解释名称。据我所知，SEO方面没有区别，但从理论上讲，浏览DOM的人会花更少的时间来“解构”<header>标签。

然而，再一次，在一天结束时的选择确实归结为个人偏好。

希望这会有所帮助：）