HTML 结构：构建模块
理解 HTML 文档的基本结构。
HTML 结构：构建模块 是 CoddyKit 上的免费 HTML for Kids 课时。 这是第 2 节课，共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 HTML for Kids 学习路径的一部分，你的进度在网页和 CoddyKit 应用中同步。 HTML for Kids 课程共包含 4 节课。
HTML 结构：构建模块
欢迎来到第二课！今天，我们将学习 HTML 文档的结构，以及各个部分如何组合在一起。您可以把这看作学习网页的骨架。
HTML 文档结构
HTML 文档具有浏览器能够理解的特定结构。它就像一份食谱，用来告诉浏览器该做什么。
HTML 文档的基本部分包括：
- 文档类型声明：告诉浏览器这是一个 HTML 文档。
- HTML 标签：包含页面的所有内容。
- 头部：包含页面的信息（例如标题）。
- 主体：包含用户可见的内容。
结构是什么样的？
下面是基本 HTML 文档结构的示例：
<!DOCTYPE html>
<html>
<head>
<title>My Web Page</title>
</head>
<body>
<h1>Welcome to My Page</h1>
<p>This is the content of my web page.</p>
</body>
</html>
文档类型声明
<!DOCTYPE html>声明出现在每个 HTML 文档的顶部。它告诉浏览器接下来是 HTML5，也就是最新版本的 HTML。
您可以把它看作 HTML 食谱的起点！
HTML 标签
<html>标签是文档中所有代码的主要容器。它告诉浏览器：“这里面的所有内容都是 HTML。”
它的写法如下：
<html>
<!-- All other HTML tags go here -->
</html>
头部部分
<head>部分包含网页的信息，但这些信息不会直接显示在页面上。例如：
- 标题：浏览器标签页中显示的文本。
- 元信息：页面描述等额外信息。
示例：
<head>
<title>My Cool Web Page</title>
</head>
主体部分
<body>部分包含用户可见的所有内容，例如文本、图像和链接。这是页面的主要内容区域。
示例：
<body>
<h1>Welcome!</h1>
<p>This is my awesome web page.</p>
</body>
组合起来
下面是一个包含刚才所学全部部分的完整 HTML 文档示例：
<!DOCTYPE html>
<html>
<head>
<title>All About Me</title>
</head>
<body>
<h1>Hi, I’m a Web Creator!</h1>
<p>This is my first structured HTML page.</p>
</body>
</html>
做得很好！
恭喜您！您已经学会了 HTML 文档的结构。现在，您了解了各个部分如何组合起来构成网页。在下一课中，我们将开始向网页添加实际内容。准备好创建您的第一个网页杰作吧！
用 AI 导师学习 HTML — 免费
在浏览器中编写并运行真实代码，获得全天候 AI 导师的即时帮助，并在网页或应用中继续学习。
- 课程
- 16
- 课程
- 35
常见问题解答
「HTML 结构：构建模块」课时是免费的吗？
是的 — 「HTML 结构：构建模块」的完整文本可在网页上免费阅读。要进行交互式练习（内置代码编辑器和全天候 AI 导师）并解锁 HTML for Kids 课程的其余内容，请升级到 CoddyKit PRO。 HTML for Kids 课程共包含 4 节课。
「HTML 结构：构建模块」这节课中我会学到什么？
理解 HTML 文档的基本结构。 你通过在浏览器中直接运行的动手代码来练习 HTML for Kids，全天候 AI 导师会在你学习这节课的过程中回答你的问题。
学习 HTML for Kids 需要有经验吗？
无需任何先前经验。CoddyKit 上的 HTML for Kids 课程适合初学者到高级学习者，你可以从这里开始或从头开始，按照自己的节奏学习。 这是第 2 节课，共 4 节。
「HTML 结构：构建模块」课时需要多长时间？
大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动，所以你能稳步进步，并在网页和应用中从离开的地方继续。
我能在这节 HTML for Kids 课中编写并运行代码吗？
能。每节 HTML for Kids 课都包含内置代码编辑器，你可以在浏览器中直接编写并运行真实代码，并获得即时 AI 反馈 — 无需本地设置。
此课程中的所有课时
- 什么是 HTML
- HTML 结构：构建模块
- HTML 标签与元素
- 设置您的第一个 HTML 页面