Skip to content

Latest commit

 

History

History
39 lines (26 loc) · 2.13 KB

187.md

File metadata and controls

39 lines (26 loc) · 2.13 KB

HTML5 – <section>标签示例

原文： https://howtodoinjava.com/html5/html5-section-tag/

HTML5 <section>标签定义了文档中的各个部分，例如章节，页眉，页脚或文档的任何其他部分。 以前（在 HTML5 之前），只能通过<div>标签提供这种分离的唯一方法。

section元素是语义元素。 这意味着它为用户代理和人员提供了有关所含内容（具体是文档的一部分）的含义。 它是一个通用语义元素，因此当其他语义容器元素（article，aside和nav）都不适合时，应使用它。

<section>标签语法

在 HTML5 中创建<section>时，就像在 HTML 中使用<div>标签时一样，可以使用 ID 或类属性。 每个 ID 必须是唯一的，如 HTML 中一样，并且类可以在必要时多次使用。

您应该始终将标头元素（H1至H6）作为section的一部分。 如果您无法提供该部分的标题，那么<div>元素可能更合适。 而且永远不要使用section标签仅用于放置样式。

假设您正在创建有关数据处理的文档。 以下是<section>元素的典型用法。

<section id="preparation" class="imaginaryClass">
     <h2>Prepare Data</h2>
     <p>Random text Random text Random text...</p>
</section>
<section id="processing">
     <h2>Process Prepared Data</h2>
     <p>Some More Random text Some More Random text Some More Random text ...</p>
</section>
<section id="display">
     <h2>Processed Data</h2>
     <p>Some More Random text Some More Random text Some More Random text ...</p>
</section>

总结

<section></section>元素的目的不是替换 HTML <div>标签。 如果要将文档划分为逻辑文档部分（以定义内容的语义上离散的部分），请使用<section></section>元素或结构元素之一。 但是，如果仅出于格式化目的分割文档，则适合使用<div>标签。

如果正确使用它们，则可以在有效的 HTML5 文档中同时使用DIV和SECTION元素。

学习愉快！