写好一个HTML页面只是第一步，很多情况下页面在桌面浏览器里显示正常，但到了手机屏幕上可能出现宽度不合适、字号过小、触摸事件失效等问题。为了验证移动端效果，通常需要把本地HTML放到手机浏览器中运行。手机操作系统对本地文件的打开方式与电脑不同，因此要掌握几种可行的方法。下面分别从直接打开、局域网服务器、远程调试与托管、打包安装四个角度来讲解。
一、通过文件管理器和手机浏览器直接打开本地HTML
电脑上双击HTML文件就会调用默认浏览器解析，但在手机上，直接点击HTML文件的行为会受文件管理器限制。Android手机通常允许文件管理器把HTML文件交给浏览器，这时地址栏会显示类似 file:///storage/emulated/0/Download/index.html 的路径。如果你的页面只包含静态内容，不依赖Ajax请求、本地JSON和某些现代API，这种方式可以快速查看效果。
不过file协议下的页面会遇到跨域限制。例如页面使用fetch读取同目录下的data.json，部分浏览器出于安全策略会直接拦截。另外，CSS和JavaScript的相对路径在file协议下一般能够解析，但路径中含中文或空格时可能导致资源加载失败。建议把文件名改成英文，目录层级尽量简单。
iPhone和iPad上的Safari不能像Android那样直接打开任意本地HTML文件，因为iOS没有开放通用的文件系统访问。即使通过文件App打开HTML，也常常只是预览源码或纯文本，不会完整执行脚本。iOS用户更适合使用后面提到的局域网服务器或第三方工具。
二、搭建本地HTTP服务器让手机通过局域网访问
这是最接近真实部署环境的调试方式。电脑和手机连接同一个Wi-Fi，在电脑的项目目录启动一个静态服务器，然后手机浏览器访问电脑的局域网IP和端口。HTTP协议下，页面可以正常发起相对路径请求、读取JSON、加载字体和图片，跨域限制更少。
如果你安装了Python，可以直接在项目目录打开终端执行：
# Python 3.x python -m http.server 8080
启动后在电脑浏览器测试 http://127.0.0.1:8080，再通过ipconfig或ifconfig查看电脑的局域网地址，比如192.168.1.5。手机浏览器中输入http://192.168.1.5:8080即可访问。注意该地址中的127.0.0.1和192.168.1.5属于本地和局域网地址，不会被替换。
前端开发者更常用Node.js的http-server包。在项目目录执行npm install -g http-server，然后运行：
http-server -p 8080 -a 0.0.0.0
-a 0.0.0.0表示监听所有网络接口，否则手机可能无法访问。VS Code用户可以安装Live Server扩展，右键HTML文件选择Open with Live Server，然后手动把地址中的127.0.0.1改成电脑局域网IP，手机即可打开。
三、使用远程调试和在线静态托管预览
局域网方案要求手机和电脑在同一网络，如果不在一个网络，可以通过在线托管或远程调试解决。将HTML文件上传到任意静态站点服务，如GitHub Pages、Netlify或Vercel，会得到一个公网可访问的HTTPS地址，手机浏览器直接打开就能测试。这种方式还能测试PWA的Service Worker、HTTPS下的传感器API等需要安全上下文的功能。
如果要调试手机上实际运行时的报错和网络请求，可以开启浏览器远程调试。Android手机连接电脑后，在Chrome中访问chrome://inspect，页面会列出手机浏览器打开的标签页。点击inspect后，可以在电脑的开发者工具中查看移动端的控制台输出、DOM结构和网络请求。iOS需要Mac上的Safari配合，开启手机的Web检查器后，在Mac的Safari开发菜单中调试。
远程调试并不能替代局域网服务器，它主要用于排查问题。调试前需要确保手机浏览器打开了USB调试或相应设置，并在电脑上安装了对应驱动。对于普通HTML页面，线上托管加移动端开发者工具已经能满足多数预览需求。
四、将HTML网页打包成WebView应用或PWA安装到手机
如果希望HTML页面像原生应用一样出现在手机桌面，可以把它包装成PWA或APK。PWA方案是在HTML项目中加入manifest.json和Service Worker，配置display: standalone和图标后，Android的Chrome会提示添加到主屏幕，iOS的Safari也可以通过添加到主屏幕实现类似效果。PWA需要HTTPS环境，所以本地文件或普通HTTP服务器无法完整测试。
另一个思路是使用WebView壳工程打包APK，例如通过HBuilder、Capacitor或Cordova把HTML、CSS、JavaScript封装成Android安装包。这种方式的优点是能够调用部分原生能力，但需要配置Android SDK或使用云打包服务。对于只需要简单查看页面的用户来说，打包步骤稍显复杂，局域网服务器或在线托管已经足够。
无论采用哪种方式，最终目的都是在真实移动环境中检查布局、交互和性能。建议在开发过程中同时使用桌面浏览器的设备模拟器和真机预览，因为模拟器只模拟屏幕尺寸，不模拟触摸延迟、内存限制和移动端浏览器的渲染差异。
总结一下：如果只是看静态页面，Android可以直接打开本地文件；如果页面依赖资源请求或JSON数据，局域网HTTP服务器是最稳妥的方法；如果手机和电脑不在同一网络，可以上传到静态托管平台；如果需要长期使用或调用原生能力，再考虑PWA或打包APK。掌握这些方法后，就能根据具体场景快速选择最适合的手机运行方案。