好的，我来把前两个组件（网页框架 + 图文混排）里涉及到的 HTML 专业术语梳理出来，逐一解释它们在博客中的功能，并指出在我们做的页面中对应的实际内容。

📖 HTML 专业术语解释（组件 1 + 组件 2）

1. <!DOCTYPE html>

• 术语解释：文档类型声明，告诉浏览器要用 HTML5 标准模式来解析网页。

• 博客中的功能：避免浏览器进入“怪异模式”，保证页面结构和样式一致。

• 在我们的博客中对应：index.html 第一行的

  <!DOCTYPE html>
  
  

2. <html> 标签

• 术语解释：网页的根元素，所有页面内容都要包含在 <html> ... </html> 里。
• 博客中的功能：定义页面的语言环境与整体范围。
• 在我们的博客中对应：<html lang="zh-CN"> ... </html> 整个文件。

3. <head> 标签

• 术语解释：文档头部，存放元信息（meta）、标题（title）、样式表、脚本等。

• 博客中的功能：不会直接显示在页面上，但决定页面标题、编码方式、适配方式。

• 在我们的博客中对应：

  <head>
    <meta charset="utf-8" />
    <title>My First Blog</title>
  </head>
  
  

4. <meta charset="utf-8">

• 术语解释：指定网页的字符编码。UTF-8 支持中文，不会出现乱码。