HTML是前端开发的基础标记语言，想要验证自己写的html语句是否正确，就需要掌握对应的运行方法，不同的运行场景适合不同的操作方式。
直接使用浏览器打开本地HTML文件
这是最基础的运行html语句的方法，适合单个简单的html文件测试，不需要安装任何额外的工具。
操作步骤
- 先把写好的html语句保存为后缀是.html的文件，比如命名为test.html，注意保存的时候编码选择UTF-8，避免出现中文乱码。
- 找到保存好的test.html文件，右键点击文件，选择用你常用的浏览器打开，比如Chrome、Edge、Firefox都可以。
- 浏览器会自动解析文件里的html语句，渲染出对应的页面效果，你可以在页面上看到自己写的标签内容。
示例代码
下面是一个简单的html语句示例，保存后按上述步骤操作就能看到运行效果：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>测试页面</title>
</head>
<body>
<h1>这是我的第一个HTML页面</h1>
<p>这里是一段测试文本</p>
</body>
</html>
借助本地服务器运行HTML项目
如果你的html语句里涉及到Ajax请求、引用本地资源路径比较复杂，或者是一个多文件的前端项目，直接用浏览器打开可能会出现资源加载失败的问题，这时候就需要用本地服务器来运行。
使用Node.js的http-server工具
首先你需要安装Node.js环境，安装完成后打开命令行工具，执行下面的命令安装http-server：
npm install -g http-server
安装完成后，进入你的html文件所在的目录，执行下面的命令启动服务器：
http-server -p 8080
之后打开浏览器，访问http://127.0.0.1:8080或者http://localhost:8080，就能看到你的html页面运行效果，这种方式可以正常加载本地的各类资源。
使用在线编辑器运行HTML语句
如果你只是临时想测试一小段html语句，不想在本地创建文件，也可以使用在线编辑器来运行，不需要任何本地配置。
常见的在线编辑器比如CodePen、JSFiddle等，你只需要在对应的HTML编辑区域输入你的html语句，点击运行按钮，就能实时看到页面效果，非常适合快速调试小段代码。
不同运行方法的适用场景
| 运行方法 | 适用场景 | 优点 |
|---|---|---|
| 浏览器直接打开 | 单个简单HTML文件测试 | 操作简单，无需额外工具 |
| 本地服务器运行 | 多文件项目、涉及本地资源请求的HTML | 资源加载正常，支持复杂项目调试 |
| 在线编辑器运行 | 临时测试小段HTML语句 | 无需本地配置，随时随地可用 |
运行时的常见问题
- 如果页面出现中文乱码，检查html文件的<head>标签里是否设置了<meta charset="UTF-8">，同时保存文件的时候编码选择UTF-8。
- 如果用浏览器直接打开页面，控制台提示资源加载失败，优先检查资源的路径是否正确，或者切换到本地服务器的方式运行。
- 如果修改了html语句之后刷新页面没有变化，可能是浏览器缓存导致，可以清除浏览器缓存后再刷新，或者按Ctrl+F5强制刷新。