很多初学者用Windows自带的记事本编写HTML代码，写完后一般会保存成txt文件，双击打开时看到的是满屏代码而不是渲染后的网页。要解决这个问题，关键在于理解文件扩展名和默认打开方式两个概念。
下面我们分步骤来解决。
一、保存文件时一定要改对扩展名
记事本默认保存的文件格式是纯文本，扩展名为 .txt。如果你在保存时直接输入文件名“index”然后点击保存，得到的文件其实是 index.txt，即使你把代码写成了HTML结构，双击后系统仍然会调用记事本打开它，因为系统只认识 .txt 后缀。要让浏览器识别，必须把扩展名改成 .html 或者 .htm。
正确的保存方法如下：在记事本中点击“文件”菜单，选择“另存为”，在弹出的对话框底部有一个“保存类型”下拉框，默认是“文本文档(*.txt)”，你需要把它改成“所有文件”。然后在“文件名”输入框中输入完整的文件名，比如 index.html，注意一定要带上 .html 后缀。编码建议选择 UTF-8，这样中文不会乱码。保存位置随意，比如桌面。
如果你保存后发现文件名还是 index.html.txt，说明你的系统隐藏了已知文件类型的扩展名，导致你以为写的是 .html 实际上后面还跟着 .txt。要解决这个问题，打开任意文件夹窗口，点击“查看”选项卡，勾选“文件扩展名”复选框，让扩展名显示出来，然后再重命名文件，把后面的 .txt 去掉即可。一个完整的HTML文件基本结构如下：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>我的第一个网页</title>
</head>
<body>
<h1>你好，世界</h1>
<p>这是用记事本编写的网页。</p>
</body>
</html>
把上面内容复制到记事本，按照正确方法保存为 hello.html，然后双击试试，如果浏览器正常打开并显示“你好，世界”，说明扩展名问题已经解决。如果还是记事本打开，就需要修改系统默认关联了。
二、修改文件关联，让浏览器默认打开HTML文件
Windows系统默认情况下，.html 文件可能被关联到了记事本，尤其是某些精简版系统或者安装某些文本编辑器后会抢占关联。此时即使扩展名正确，双击文件仍然会用记事本打开。要解决这个问题，需要手动指定默认程序。
最快捷的方法是右键点击那个HTML文件，选择“打开方式”，在弹出的程序列表里找到你常用的浏览器，比如 Chrome、Edge 或 Firefox。如果列表里没有，点击“选择其他应用”，找到浏览器后，务必勾选下方的“始终使用此应用打开 .html 文件”复选框，再点击确定。这样以后双击所有 .html 文件都会交给浏览器处理。
另一种方式是通过系统设置统一修改：点击开始菜单，进入“设置” -> “应用” -> “默认应用”，在页面下方找到“按文件类型指定默认应用”，在列表里找到 .html 和 .htm，点击右侧当前关联的程序名称，从弹出的应用列表中选择浏览器即可。这种方法更彻底，适合需要批量处理多个文件的情况。
需要注意的是，如果你的电脑上安装了多个浏览器，选择你日常使用的那一个。另外，有些网页在本地打开时会因为安全策略限制部分功能，比如直接读取本地文件、发起跨域请求等，这些限制跟默认打开方式无关，属于浏览器对 file:// 协议的内置限制，后面会提到解决办法。
三、直接拖入浏览器窗口或使用“文件”菜单打开
如果你不想修改系统默认关联，也可以每次手动选择浏览器打开。除了右键的“打开方式”，你还可以直接把HTML文件拖到已经打开的浏览器窗口里，浏览器会立即渲染这个文件。以 Chrome 为例，打开浏览器后，把桌面上的 index.html 文件拖进浏览器标签页区域，松开鼠标，页面就会加载。
另一个方法是利用浏览器自带的“打开文件”功能。在 Chrome 或 Edge 中，按下快捷键 Ctrl + O，会弹出文件选择对话框，选择你要打开的HTML文件，点击打开即可。Firefox 的快捷键也是 Ctrl + O。这种方式适合临时查看某个文件，不需要改变任何系统设置，也不会影响其他文件的打开方式。
有些用户习惯直接双击 HTML 文件，但又不想改变默认程序，可以创建一个快捷方式指向浏览器并带上文件路径，不过对新手来说不太友好。综合来看，右键“打开方式”和拖拽两种方式已经足够日常使用。如果经常需要打开HTML文件，建议还是花一分钟把默认关联改好，一劳永逸。
四、本地调试时可能遇到的怪问题及简单解决方案
当你的HTML文件通过 file:// 协议在浏览器中打开时，大多数静态内容都能正常显示，比如文字、图片、CSS样式。但一旦涉及 AJAX 请求、ES6 模块导入、Service Worker 等现代前端功能，浏览器会阻止这些操作，控制台会报出类似“CORS policy”或者“origin null”的错误。这是因为 file:// 协议下没有真正的域名和端口，浏览器出于安全考虑限制了跨域行为。
对于学习HTML和CSS的初学者来说，暂时用不到这些高级功能，所以直接双击打开文件完全没有问题。如果你已经开始学习 JavaScript 的异步请求或者模块化开发，就需要在本地启动一个简单的HTTP服务器。最简单的办法是利用 Python 自带的 http.server 模块。先在记事本中写好HTML文件，保存到某个文件夹，假设文件夹路径是 C:\myweb\，然后打开命令提示符，进入该目录：
cd C:\myweb\ python -m http.server 8000
上面的命令会启动一个监听在 8000 端口的本地服务器。接下来打开浏览器，在地址栏输入 http://127.0.0.1:8000/ 就能看到你的文件列表，点击对应的HTML文件即可访问，协议变成了 http://，大部分浏览器安全限制都会解除。如果你没有安装 Python，也可以使用 Node.js 的 http-server 包，或者使用 VSCode 的 Live Server 插件，效果是一样的。
总结一下，记事本写完HTML后运行起来并不复杂，核心就是搞对文件扩展名和默认打开方式。只要这两个设置正确，双击就能在浏览器中查看效果。遇到动态功能被限制时，再用本地HTTP服务器来解决。希望这篇教程能帮你顺畅地开始网页开发的第一步。