在移动端开发或者HTML学习过程中，经常需要在手机上查看代码的运行效果，验证页面在不同屏幕尺寸下的适配情况。下面介绍几种实用的手机运行HTML代码的方法，覆盖不同使用需求。
方法一：直接打开本地HTML文件
这种方法适合查看纯静态的HTML页面，不需要网络环境，操作最简单。
操作步骤
- 将写好的HTML文件保存到手机的存储目录中，比如新建一个
html_demo文件夹，把文件命名为index.html放进去。 - 打开手机自带的文件管理应用，找到刚才保存的
index.html文件。 - 点击文件，在弹出的打开方式中选择手机安装的浏览器，比如Chrome、Edge等，即可直接运行查看效果。
注意如果HTML中引用了同目录下的其他资源文件，比如CSS、JS或者图片，只要路径是相对路径，也可以正常加载。
方法二：使用简易HTTP服务器
如果HTML页面包含AJAX请求、需要访问本地接口，或者引用了需要服务器环境的资源，直接打开本地文件可能会出现跨域或者资源加载失败的问题，这时候可以用简易服务器来运行。
借助Termux搭建服务器（安卓手机）
Termux是安卓平台的终端模拟器，可以在手机上运行Linux命令，搭建简单的HTTP服务器。
操作步骤
- 在应用商店下载安装Termux，打开后先更新软件源，执行以下命令：
pkg update pkg upgrade
- 安装Python，因为Python自带简易HTTP服务器模块：
pkg install python
- 进入存放HTML文件的目录，比如之前的
html_demo文件夹：
cd /sdcard/html_demo
- 启动HTTP服务器，默认端口是8000：
python -m http.server 8000
- 查看手机的局域网IP地址，一般在WiFi设置的高级选项中可以找到，假设IP是192.168.0.100。
- 打开手机浏览器，输入地址
192.168.0.100:8000，即可访问运行的HTML页面。
使用前端开发工具的内置服务器
如果在电脑上编写代码，也可以借助VS Code等工具的Live Server插件，把电脑变成服务器，手机和电脑连接同一个局域网就可以访问。
- 电脑上打开VS Code，安装Live Server插件。
- 打开HTML文件，右键选择Open with Live Server，会自动启动服务器，默认端口是5500。
- 查看电脑的局域网IP，比如是192.168.0.101，手机浏览器输入
192.168.0.101:5500即可访问。
方法三：使用在线代码运行平台
如果不想在手机上安装额外工具，也可以使用在线平台直接运行HTML代码，适合临时测试小段代码。
- 打开手机浏览器，访问支持HTML在线运行的平台，比如JSFiddle的移动端页面。
- 在HTML编辑区域粘贴自己的代码，点击运行按钮，即可在下方预览区域看到效果。
这种方法的缺点是如果代码比较复杂或者依赖本地资源，可能无法正常运行，适合简单的代码片段测试。
常见问题说明
| 问题 | 解决方法 |
|---|---|
| 直接打开HTML文件样式丢失 | 检查CSS文件的引用路径是否为相对路径，确保CSS文件和HTML文件在同一目录或者正确的子目录下 |
| 服务器启动后手机无法访问 | 确认手机和电脑/服务器设备连接的是同一个局域网，关闭设备的防火墙再尝试 |
| 页面在手机上布局错乱 | 在HTML的head标签中添加视口设置代码，适配移动端屏幕 |
下面是移动端适配的视口设置代码示例：
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
</head>
以上几种方法基本覆盖了手机运行HTML代码的常见场景，你可以根据自己的实际需求选择合适的方式，快速验证页面效果。