HTML 编辑器

选择你的 HTML 编辑器

你可以使用任何文本编辑器编写 HTML。对于学习最基础的内容，即使是像记事本 (Windows) 或 TextEdit (Mac) 这样的简单程序也可以。

然而，要高效且专业地编写 HTML，你应该使用专门的代码编辑器。现代代码编辑器提供了显著提高生产力和代码质量的功能：

语法高亮：通过对不同部分（标签、属性、值）进行着色，使代码更易于阅读。
代码补全（智能提示）：在你输入时提供标签、属性和值的建议，减少错误。
错误检查/代码 Lint：帮助识别代码中的语法错误或潜在问题。
集成终端：允许你直接在编辑器内运行命令（例如 Git 或构建工具）。
扩展/插件：使用针对特定语言、框架或工作流程的工具自定义你的编辑器。

流行的免费代码编辑器：

Visual Studio Code (VS Code)：非常流行、多功能且可扩展。是 Web 开发的优秀选择。
Sublime Text：快速、轻量且高度可定制（持续使用需要许可证，但有无限制的免费试用期）。
Atom：由 GitHub 开发的另一款功能强大且可定制的编辑器。
Brackets：一款专注于 Web 设计的编辑器。

我们推荐从 VS Code 开始，但请随意尝试其他编辑器，看看你更喜欢哪一个。

创建你的第一个 HTML 页面（通用步骤）

无论你选择哪种编辑器，基本步骤都相似：

步骤 1：打开你的编辑器

启动你安装的代码编辑器（例如，VS Code）。

步骤 2：创建新文件

前往“文件 > 新建文件”（或使用键盘快捷键，通常是 Ctrl+N 或 Cmd+N）。

步骤 3：编写 HTML 代码

在编辑器中输入或粘贴以下基本的 HTML 结构：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My First Web Page</title>
</head>
<body>

    <h1>My First Heading</h1>
    <p>My first paragraph.</p>

</body>
</html>

请注意，代码编辑器通常会对标签、属性和文本进行不同着色，使其比纯文本记事本更容易阅读。

步骤 4：保存 HTML 文件

前往“文件 > 另存为…”（或使用 Ctrl+S / Cmd+S）。

选择计算机上保存文件的位置。

将文件命名为 index.html。使用 .html 作为文件扩展名是标准做法。虽然 .htm 也可行，但 .html 更常用。

确保编码设置为 UTF-8。这对于正确显示各种字符至关重要，并且是 Web 的标准。大多数现代编辑器默认为 UTF-8。

提示
`index.html` 这个名称很特别。当你导航到一个目录时，Web 服务器通常会默认查找名为 `index.html` 的文件。

步骤 5：在浏览器中查看页面

打开计算机的文件资源管理器，导航到保存 index.html 的位置。

双击 index.html 文件。它应该会在你的默认 Web 浏览器中打开，显示你的标题和段落。

或者，你通常可以右键点击文件并选择“打开方式”来选择特定的浏览器。

恭喜！你已经使用现代工作流程创建并查看了你的第一个网页。