根本原因是file://协议下浏览器禁用跨资源请求，导致js/css失效；应改用http服务（如termux起python -m http.server）或编辑器预览功能解决。
直接用 Chrome 输入 file:/// 路径能打开，但 JS/CSS 会失效
安卓上点开 index.html 文件常为空白或样式错乱，不是代码写错了，而是浏览器用 file:// 协议加载时禁用了大多数现代 Web API。典型表现包括：
-
fetch()报错：Access to script at 'file:///xxx.js' from origin 'null' has been blocked - CSS/JS 文件 404，控制台显示
Failed to load resource - 页面渲染了 HTML 结构，但交互、动画、数据加载全挂
根本原因是：Chrome、Edge 等现代浏览器默认拒绝从本地文件系统发起跨资源请求。哪怕 style.css 和 index.html 在同一文件夹，file:// 下也不算“同源”。
临时验证方式：把所有 CSS/JS 内联进 <style></style> 和 <script></script> 标签，删掉外部引用，再试——如果这时能显示，就确认是协议限制问题。
用 Termux 起 Python HTTP 服务最可靠
这是目前安卓离线调试最接近桌面开发体验的方式，不依赖第三方 APK，权限干净，路径可控。
操作步骤：
- 安装 Termux（F-Droid 或 GitHub 官方源）
- 运行
pkg install python - 把你的项目文件夹（含
index.html、style.css、script.js）放到~/storage/shared/your-project/ - 执行：
cd ~/storage/shared/your-project && python3 -m http.server 8000 - 在 Chrome 中访问：
http://localhost:8000/index.html
注意：http.server 默认只监听 localhost，若想用局域网其他设备访问，加参数 --bind 0.0.0.0:8000；同时需在 Termux 中运行 termux-wake-lock 防止休眠断连。
Acode / QuickEdit 编辑器预览功能省事但有边界
这类编辑器内置轻量 HTTP 服务，点一下「预览」就能起服务并自动打开浏览器，适合快速改样式、调布局。
优点和限制很明确：
- 不用记命令、不配路径，打开文件 → 点预览 → 刷新即见效果
- 支持热重载（改完保存，页面自动刷新）
- 不支持
Service Worker、import map、localStorage跨域写入等高级特性 - 若项目用了
fetch('/api/data.json')，而该 JSON 不在同目录下，仍会 404 —— 它只 serve 当前文件所在目录，不递归或代理
本质是它起了个最小化 http.server，端口随机（如 http://localhost:52134），所以别硬记地址，靠编辑器按钮跳转最稳。
微信/QQ 点开 index.html 是假打开，慎用
通过微信“文件传输助手”发 index.html，点击后实际调起的是腾讯文档的沙盒 WebView，不是 Chrome 或系统浏览器。
后果很直接：
- CSS 基本不生效，
@media查询失效，Flex/Grid 布局错位 - JS 执行受限，
console.log不输出，localStorage为空 - 无法打开开发者工具，没法查错
如果你只是想看个静态说明页，它勉强能用；但凡涉及任何交互、异步加载、响应式测试，必须绕过微信，走真实浏览器 + HTTP 服务路径。
真正难的不是“怎么打开”，而是判断你这个 index.html 到底依赖了哪些浏览器能力——一旦用了 fetch、import()、Web Components 或相对路径资源，file:// 就彻底出局，HTTP 服务是唯一出路。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
