HTML双击打不开主因是file://协议限制，非浏览器故障；应启用Live Server插件、保存文件、用UTF-8编码并声明，或运行本地服务器如npx serve。
HTML 文件双击打不开，大概率不是浏览器问题，而是文件路径、编码或协议限制在作祟。
双击打开显示空白或报错 file:// 路径异常
Windows/macOS 双击 HTML 文件时，系统会用默认浏览器通过 file:// 协议加载，但很多现代浏览器（Chrome、Edge）对本地 file:// 页面做了严格限制：禁止读取本地 JS/CSS、禁用 fetch、甚至阻止某些 DOM 操作。
- 常见现象：
net::ERR_FILE_NOT_FOUND、Access to script at 'file:///xxx.js' from origin 'null' has been blocked - 真实原因：不是文件丢了，是浏览器主动拦截了跨源资源加载
- 临时解决：Chrome 启动时加参数
--allow-file-access-from-files（仅调试用，不推荐长期使用） - 正解：用本地服务器跑，比如
npx serve、python3 -m http.server 8000，然后访问http://localhost:8000
VS Code 或编辑器里右键“Open with Live Server”没反应
这通常是因为插件没装、没启用，或者当前文件没保存（Live Server 默认只服务已保存的 .html 文件）。
- 检查是否安装了
ritwickdey.LiveServer插件，并确认已启用 - 确保文件已保存（哪怕只敲了个空格也要
Ctrl+S），未保存的临时文件不会被服务 - 确认文件扩展名是小写
.html，不是.HTML或.htm（部分插件对大小写敏感） - 如果项目有
index.html，Live Server 会自动找它；否则需手动在地址栏输入完整路径，如http://127.0.0.1:5500/test.html
页面打开但样式/脚本全失效
很大可能是路径写错了——尤其是用了相对路径但文件结构和预期不符。
htmlppt.skill
下载
把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。
- 检查
中的css/style.css是否真在当前 HTML 文件同级的css/目录下 - 用浏览器开发者工具（F12）看 Network 标签页，点开红色的 404 请求，看浏览器实际请求的是什么路径
- 避免用
./开头（多数情况冗余），直接写css/style.css；需要上一级用../，但别嵌套太多层，容易晕 - JS 报
Uncaught SyntaxError: Unexpected token '？通常是路径错导致服务器返回了 HTML（比如 404 页面）而不是 JS 文件
中文乱码或特殊符号显示为问号
根本原因是 HTML 文件保存编码和声明不一致。记事本另存为时默认是 GBK，但网页标准要求 UTF-8。
- 用 VS Code 打开文件，右下角看状态栏编码（如显示
GBK），点击后选Save with Encoding → UTF-8 - 确认 HTML 顶部有且仅有这一行声明：
（放在里，且越靠前越好） - 不要同时写
charset=gbk和charset=utf-8，浏览器只认第一个 - 如果用了构建工具（Vite、Webpack），检查其配置是否强制指定了编码，有时会覆盖文件本身编码
最常被忽略的一点：双击打开时，浏览器地址栏显示的是 file:/// 开头的路径，这种场景下几乎所有前端开发习惯（模块导入、API 调用、本地存储权限）都会失效——这不是 bug，是安全策略。别硬扛，起个本地服务，三秒解决。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
