HTML文档结构

### HTML文档结构

一个标准的HTML文档由几个主要部分组成，它们共同定义了网页的结构和内容。

### HTML基本结构

一个基本的HTML文档通常包含以下部分：

```html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document Title</title>
</head>
<body>
    <p>Hello, World!</p>
</body>
</html>
```

1. **文档类型声明（DOCTYPE）**：告诉浏览器这是一个HTML5文档。
2. **`<html>`元素**：根元素，包含所有的HTML内容。
3. **`<head>`元素**：包含文档的元数据，如字符集声明、文档标题和链接到CSS文件。
4. **`<body>`元素**：包含可见的页面内容，如文本、图片、链接等。

### 文档类型声明（DOCTYPE）

文档类型声明（DOCTYPE）是一个标准通用标记语言的文档类型声明，它的目的是告诉浏览器关于页面使用的HTML规范的版本。对于HTML5，DOCTYPE非常简单：

```html
<!DOCTYPE html>
```

这行代码必须位于HTML文档的第一行，它告诉浏览器这是一个HTML5文档。

### `<html>`元素

`<html>`元素是页面的根元素，所有的其他元素都包含在这个元素内。它定义了整个HTML文档的开始和结束。`<html>`元素通常包含一个`lang`属性，用于定义页面内容的主要语言，这对于搜索引擎优化和屏幕阅读器等辅助技术非常重要。

### `<head>`和`<body>`元素

- **`<head>`元素**：`<head>`元素包含了文档的元数据，即不直接显示在页面上的内容。这些元数据包括：
  - `<meta>`标签：定义字符编码（如`<meta charset="UTF-8">`）和其他浏览器应该知晓的元数据。
  - `<title>`标签：定义文档的标题，显示在浏览器的标签页上。
  - 链接到外部资源，如CSS文件（`<link rel="stylesheet" href="styles.css">`）和JavaScript文件（`<script src="script.js"></script>`）。
  - 其他元数据，如视口设置（`<meta name="viewport" content="width=device-width, initial-scale=1">`）。

- **`<body>`元素**：`<body>`元素包含了所有可见的页面内容，用户在浏览器窗口中看到的内容都在这个元素内。这包括文本、图片、表格、列表、链接等。

这些基本结构共同构成了一个HTML文档的基础，是创建任何网页的起点。