HTML详细基础H5标签入门

HTML5 引入了许多新的语义和功能性标签，以下是一些常见的 HTML5 标签及其使用示例：

1. section - 定义文档中的一个区块（部分），比如章节、头部、内容或侧边栏。

<section>
  <h1>章节标题</h1>
  <p>这里是章节的内容。</p>
</section>

2. article - 定义独立的内容，可以是一篇文章、博客、论坛的帖子等。

<article>
  <h2>文章标题</h2>
  <p>这里是文章的内容。</p>
</article>

3. aside - 定义与页面主内容少关的内容，如侧边栏。

<aside>
  <p>这里是侧边栏内容。</p>
</aside>

4. header - 定义一个区块的头部。

<header>
  <h1>网站标题</h1>
</header>

5. hgroup - 将对元素进行分组，将它们看作一个整体。

<header>
  <hgroup>
    <h1>网站主标题</h1>
    <h2>网站副标题</h2>
  </hgroup>
</header>

6. footer - 定义一个区块的底部。

<footer>
  <p>这里是页脚内容。</p>
</footer>

7. nav - 定义导航链接。

<nav>
  <ul>
    <li><a href="/home">主页</a></li>
    <li><a href="/about">关于</a></li>
  </ul>
</nav>

8. figure 和 figcaption - 用于表示一个独立的流内容，如图片、图表和插件。

<figure>
  <img src="path/to/image.jpg" alt="描述文字">
  <figcaption>这里是图片的标题。</figcaption>
</figure>

9. video 和 audio - 用于嵌入视频和音频内容。

<!-- 视频 -->
<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  您的浏览器不支持 video 标签。
</video>
 
<!-- 音频 -->
<audio controls>
  <source src="song.mp3" type="audio/mpeg">
  <source src="song.ogg" type="audio/ogg">
  您的浏览器不支持 audio 标签。
</audio>

10. main - 定义文档的主要内容区域。

<main>
  <h1>主标题</h1>
  <p>这里是主要内容。</p>
</main>

11. time - 定义一个日期或时间。

<p>我们下周三在<time datetime="2023-04-05">星期三</time>下午2点开会。</p>

12. mark - 定义需要突出显示的文本。

<p>在<mark>HTML5</mark>中，我们使用新的语义标签。</p>

13. details 和 summary - 用于创建可折叠的内容。

<details>
  <summary>点击查看详情</