## 1. 文档结构

HTML5文档的基本结构包括DOCTYPE声明、html、head和body标签,DOCTYPE声明用于告诉浏览器文档类型,html标签是根元素,head标签包含了文档的元数据,如字符集、标题和样式表链接等,body标签包含了文档的内容。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>页面标题</title>
    <!-- 其他元数据 -->
</head>
<body>
    <!-- 页面内容 -->
</body>
</html>

## 2. 文本标签

HTML5提供了一些新的文本标签,如<header><nav><section><article><aside><footer>,这些标签可以更好地描述文档的结构。

### 2.1 header标签

header标签用于包含页面或文章的头部信息,通常包含网站的标志、主导航和搜索框等。

<header>
    <h1>网站标志</h1>
    <nav>导航菜单</nav>
    <form>搜索框</form>
</header>

### 2.2 nav标签

nav标签用于包含页面的主导航链接。

<nav>
    <ul>
        <li><a href="#">首页</a></li>
        <li><a href="#">关于我们</a></li>
        <li><a href="#">产品</a></li>
        <li><a href="#">联系我们</a></li>
    </ul>
</nav>

### 2.3 section标签

HTML5是最新的HTML标准,它引入了许多新的元素和属性,使得网页设计更加灵活和强大。HTML5不仅提供了更好的语义化标签,还支持多媒体内容、图形和动画等。在本文中,我们将详细介绍HTML5的基本结构和常用标签。

section标签用于定义文档中的一个区块,通常包含一个独立的主题或一组相关的内容。

<section>
    <h2>产品介绍</h2>
    <p>这里是产品介绍的内容。</p>
</section>

### 2.4 article标签

article标签用于定义独立的、完整的、可以独立于页面其他部分进行阅读的内容,如博客文章、新闻故事等。

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

### 2.5 aside标签

aside标签用于包含与页面主要内容相关但不是主要部分的内容,如侧边栏、广告、相关文章列表等。

<aside>
    <h3>相关文章</h3>
    <ul>
        <li><a href="#">文章1</a></li>
        <li><a href="#">文章2</a></li>
        <li><a href="#">文章3</a></li>
    </ul>
</aside>

### 2.6 footer标签

footer标签用于包含页面或区的底部信息,如版权信息、联系方式等。

<footer>
    <p>&copy; 2022 公司名称. All rights reserved.</p>
    <p><a href="mailto:info@example.com">info@example.com</a></p>
</footer>

## 3. 媒体标签和属性

HTML5引入了一些新的媒体标签和属性,如<video><audio><source><track>等,使得在网页上嵌入多媒体内容变得更加简单,HTML5还提供了一些新的属性,如controlsautoplayloop等,用于控制多媒体内容的播放。