如何用记事本编写HTML代码？
在当今各种功能强大的集成开发环境（IDE）和代码编辑器盛行的时代，使用最基础的记事本编写HTML代码似乎有些“复古”。然而，这恰恰是理解网页构建基础、学习HTML核心语法的绝佳方式。它不依赖任何自动补全或语法高亮，迫使你专注于代码本身。本文将详细介绍使用Windows系统自带的记事本（Notepad）编写、保存和运行HTML文件的完整步骤。
一、准备工作：认识你的工具
你需要的工具非常简单：
操作系统：任何版本的Windows系统（macOS用户可使用功能类似的“文本编辑”应用）。
核心工具：记事本（Notepad）。你可以在开始菜单搜索“记事本”或通过运行对话框输入“notepad”来打开它。
运行环境：任意一款现代网页浏览器，如Google Chrome、Mozilla Firefox或Microsoft Edge。
二、详细步骤：从零创建一个HTML页面
步骤1：打开记事本并编写HTML代码
首先，打开记事本。你将看到一个空白的编辑区域。在这里，你需要手动输入HTML代码。一个最基本的HTML5文档结构如下：
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>我的第一个网页</title> </head> <body> <h1>你好，世界！</h1> <p>这是我用记事本编写的第一个HTML页面。</p> </body> </html>
请仔细键入上述代码。注意每个标签的配对（如 <html> 和 </html>）以及缩进，这有助于保持代码结构清晰。
步骤2：保存为HTML文件
这是最关键的一步，如果保存格式错误，文件将无法被浏览器识别为网页。
在记事本中，点击菜单栏的“文件” -> “另存为...”。
在弹出的“另存为”对话框中，选择你希望保存文件的位置（例如桌面或某个文件夹）。
在“文件名(N):”输入框中，为文件命名，必须包含
.html或.htm扩展名。例如：my_first_page.html。在“保存类型(T):”下拉框中，选择“所有文件(*.*)”。如果保持默认的“文本文档(*.txt)”，文件将被保存为.txt文本格式，浏览器无法正确解析。
在“编码(E):”下拉框中，建议选择“UTF-8”，以确保中文等字符能正确显示。
点击“保存”按钮。
步骤3：在浏览器中运行HTML文件
找到你刚刚保存的HTML文件（例如 my_first_page.html）。它的图标通常会关联到你系统的默认浏览器。
方法一：直接双击该文件，它将在默认浏览器中打开。
方法二：右键点击文件，选择“打开方式”，然后指定你喜欢的浏览器（如Chrome或Firefox）。
现在，你应该能在浏览器窗口中看到“你好，世界！”的标题和下方的段落文本。恭喜，你已经成功用记事本创建了一个网页！
步骤4：编辑与调试
如果你想修改网页内容：
右键点击HTML文件，选择“打开方式” -> “记事本”（或先打开记事本，再通过“文件”->“打开”来加载该文件）。
在记事本中修改你的代码。例如，将
<h1>标签内的文字改为“欢迎来到我的网站”。保存记事本中的更改（Ctrl + S）。
返回浏览器窗口，刷新页面（按F5键或点击刷新按钮），即可看到更新后的内容。
三、进阶示例：添加更多元素
为了更全面地练习，你可以在 <body> 标签内尝试添加更多HTML元素。将以下代码替换或添加到你的 <body> 中：
<body> <header> <h1>我的学习笔记</h1> <nav> <a href="https://www.ipipp.com">首页</a> | <a href="https://www.ipipp.com/about">关于</a> </nav> </header> <main> <article> <h2>HTML学习心得</h2> <p>使用记事本写HTML让我对标签结构印象深刻。</p> <ul> <li>理解文档结构</li> <li>熟悉基本标签</li> <li>手动调试代码</li> </ul> <img src="https://www.ipipp.com/images/example.jpg" alt="示例图片" width="300"> </article> </main> <footer> <p>© 2023 我的网站. 保留所有权利。</p> </footer> </body>
保存并刷新浏览器，你将看到一个包含导航、列表、图片和页脚等更复杂的页面。注意代码中网址的示例形式。
四、使用记事本编写HTML的优缺点
| 优点 | 缺点 |
|---|---|
|
|
五、后续学习建议
当你通过记事本熟悉了HTML的基本骨架和常用标签后，为了提升开发效率和体验，强烈建议转向专业的代码编辑器，例如：
Visual Studio Code (VS Code)：免费、强大，拥有丰富的HTML扩展和实时预览功能。
Sublime Text：轻快且功能强大的编辑器。
Notepad++：Windows平台下更高级的文本编辑器，具备语法高亮。
这些工具会为你提供语法高亮、代码提示、错误检测等功能，让你在巩固基础的同时，能更高效地构建更复杂的网页。
总之，用记事本编写HTML是一个宝贵的学习起点。它像练习书法时先描红一样，能帮你打下坚实的根基。完成基础的练习后，你就可以自信地使用更先进的工具，去探索CSS、JavaScript以及更广阔的Web开发世界了。