HTML 基本结构

高级测试工程师欧阳2025-09-05 22:48

HTML 基本结构

HTML（超文本标记语言）的基本结构由以下几个关键部分组成，这些部分定义了网页的框架和内容。

复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 网页内容 -->
</body>
</html>

文档类型声明

<!DOCTYPE html> 是文档类型声明，告诉浏览器使用的是 HTML5 标准。它必须放在文档的最前面。

HTML 根元素

<html> 是 HTML 文档的根元素，包含整个网页的内容。lang 属性用于指定文档的语言，例如 en 表示英语。

头部部分

<head> 包含网页的元信息，如字符集、视口设置、标题等。这些内容不会直接显示在网页上。

<meta charset="UTF-8"> 指定文档的字符编码为 UTF-8，确保正确显示多语言字符。
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 确保网页在不同设备上正确显示。
<title> 定义网页的标题，显示在浏览器的标题栏或标签页上。

主体部分

<body> 包含网页的可见内容，如文本、图片、链接等。所有用户看到的内容都放在这里。

注释

 用于在 HTML 中插入注释，注释不会显示在网页上，仅供开发者参考。

示例

以下是一个完整的 HTML 基本结构示例：

复制代码

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的网页</title>
</head>
<body>
    <h1>欢迎来到我的网页</h1>
    <p>这是一个简单的 HTML 示例。</p>
</body>
</html>