记事本可编辑HTM文件，但无语法高亮和自动补全；推荐用VS Code配Live Server插件实现UTF-8编码、热重载及本地服务器预览，避免file://协议限制与路径错误。
用记事本改 HTM 文件能行，但别指望它高亮或自动补全
HTM 文件本质就是纯文本，Windows 自带的记事本、macOS 的 TextEdit（纯文本模式）都能打开并保存。但直接双击用浏览器打开后点“查看源代码”再复制回来改，容易丢格式、乱编码——尤其含中文时。更稳妥的做法是：右键 → “打开方式” → 选记事本（或 VS Code / Notepad++ 等），确认文件编码是 UTF-8（不是 ANSI 或 GBK），否则中文会变问号。
- Notepad++ 打开后右下角看编码状态，点“编码”→“转为 UTF-8 无 BOM 格式”再保存
- VS Code 默认识别 UTF-8，但若打开后中文乱码，点右下角编码提示 → “Reopen with Encoding” → 选
UTF-8 - 改完务必用浏览器本地打开验证：
file:///D:/your-folder/index.htm，别用双击方式——某些浏览器会禁用本地 JS/CSS 加载
离线预览时 CSS/JS 不生效？检查路径和协议限制
下载的 HTM 页面常带相对路径引用外部资源，比如 。你把它和整个文件夹一起解压到本地后，必须保证目录结构不变；否则浏览器找不到 css/style.css，控制台报 net::ERR_FILE_NOT_FOUND。
- 不要只下载单个
index.htm就删掉其他文件——先看原页面源码里有没有href或src指向子目录 - Chrome 本地打开时默认禁用跨域请求，
XMLHttpRequest或fetch()会失败；如需测试动态功能，得用本地服务器（比如 VS Code 的 Live Server 插件） - 如果原页面用了 CDN 链接（如
https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js），离线后仍可加载——前提是设备联网；否则得提前下载 JS 文件，改成相对路径引用
用 VS Code + Live Server 插件实现真·热重载
这是目前最接近在线编辑器体验的本地方案：改一行 HTML，保存后浏览器自动刷新，且完全绕过 Chrome 的 file:// 协议限制。
- 安装 VS Code 后，在扩展市场搜
Live Server并安装（作者：Ritwick Dey） - 用 VS Code 打开整个 HTM 项目文件夹（不是单个文件），右键
index.htm→ “Open with Live Server” - 浏览器会打开
http://127.0.0.1:5500/index.htm，此后每次保存，页面自动刷新，控制台也能正常输出console.log - 注意：Live Server 默认根路径是当前打开的文件夹，所以所有相对路径（
./images/logo.png）都以该文件夹为基准解析
改完怎么打包发给别人？别只传单个 HTM 文件
很多人改完就右键“另存为”，结果只导出一个没样式的白板页面——因为浏览器保存时默认不下载外链资源，也不会把 CSS/JS 内联进去。
- 想发一个“点开就能用”的文件：用工具把所有依赖内联，比如用
html-inline命令行工具，或在线服务如 HTML Edit 的 “Inline CSS/JS” 功能 - 想保留原始结构便于后续维护：确保整个文件夹完整（含
css/、js/、images/），压缩成 ZIP 后发送，并提醒对方用 Live Server 或本地服务器打开 - 特别注意：有些 HTM 页面用了
data:URL 或 Base64 图片，这类内容已内嵌，改完直接另存为单文件即可用，但体积会变大
实际改一个下载来的 HTM 页面，最常卡住的不是语法，而是路径错位、编码混乱、协议拦截这三处。盯住浏览器开发者工具的 Console 和 Network 面板，比反复试错快得多。
