使用HTML5标签有什么好处 <article> ， <section> ， <figure> ， <header> ， <footer> ， <nav> ？

Question

HTML5中有一些语义标记，例如<article>, <section>, <figure>, <header>, <footer>, <nav> 。 为什么要使用它们而不是<div>或<span> ？ 有没有优化？

Answer 1

可读性

当人们使用“您只是在争论语义学！”时 作为论点的辩护，这意味着他们试图以不同的方式说同一件事。 虽然这是一个确定的说法在这里，它不是一定是真的。

使用更多语义的html标签将使您的HTML更具可读性和清晰性，同时还允许您拥有与标签相关的特定CSS，并且不一定需要div的自定义类。 现在，有人可能会争辩说，您需要以任何一种方式在类或标记中​​使用CSS，但是在某些时候，每个程序员都有首选项。 有些for (int i =0; i < count; < i++) {}写，有些for (int i = count; i > 0; i--;) {} 。

还值得一提的是，类似于<p>和<ul>这些标签具有默认的CSS属性，具体取决于您的浏览器，因此您可以使用这些标签对新页面进行一些简单的样式设置，而无需使用div从头开始创建所有内容。

归根结底，应该使用什么来帮助您编写最佳代码。 但是请注意其他选择，因为您可能需要与偏好与您不同的人一起工作。

Answer 2

使用HTML5标签（例如<article> ， <section> ， <figure> ， <header> ， <footer>和<nav>什么好处？

HTML标记了文档的结构。

它告诉用户代理：

• 这个元素是一个标题
• 这个元素是一个段落
• 这个元素是一个报价

从理论上讲，您可以使用：

• <div class="heading">
• <div class="paragraph">
• <span class="quote">

但是，那么用户代理将不会（在任何级别上）知道这些div和span代表什么。

因此，我们使用描述文档结构的元素。

这就是标记的全部目的 。 除此之外，它没有其他用途。