1、使用Live Server扩展可实现本地服务器运行与实时刷新，安装后右键HTML文件选择Open with Live Server即可在浏览器预览。
如果您在使用 Visual Studio Code 编辑 HTML 文件，但尚未配置运行环境，则需要通过合适的方式预览页面效果。以下是几种在 VSC 中运行 HTML 代码的方法：
一、使用 Live Server 扩展
Live Server 是一个广受欢迎的 VS Code 插件，能够启动本地开发服务器并实时刷新浏览器页面，非常适合前端开发调试。
1、打开 VS Code，点击左侧活动栏的扩展图标（或按下 Ctrl+Shift+X）。
2、在搜索框中输入 Live Server，找到由 Ritwick Dey 开发的官方扩展并安装。
立即学习“前端免费学习笔记（深入）”；
3、安装完成后，右键点击要运行的 HTML 文件。
4、选择 Open with Live Server，系统将自动在默认浏览器中打开该页面。
二、直接在浏览器中打开 HTML 文件
此方法无需安装额外插件，适合快速查看静态页面内容，但不支持热重载和动态资源处理。
1、在 VS Code 中保存当前编辑的 HTML 文件，确保文件后缀为 .html。
2、前往文件所在目录，右键点击该 HTML 文件。
3、选择“打开方式”，然后选择已安装的浏览器（如 Chrome、Edge 等）。
4、浏览器将加载并显示页面内容，修改代码后需手动刷新页面以查看更新。
三、配置任务运行器调用浏览器
通过自定义任务，可以在 VS Code 内部启动系统默认浏览器来运行 HTML 文件，实现一键预览。
1、在菜单栏选择 终端 → 运行任务 → 配置任务。
2、选择创建 tasks.json 文件，然后选择模板“Others”。
3、编辑 tasks.json 内容如下：
{
"version": "2.0",
"tasks": [
{
"label": "open in browser",
"type": "shell",
"command": "start",
"args": ["${workspaceFolder}/${relativeFile}"],
"windows": {
"command": "cmd /c start",
}
}
]
}
4、保存文件后，按下 Ctrl+Shift+P 打开命令面板，输入并选择“运行任务”，然后选择“open in browser”即可在浏览器中打开当前 HTML 文件。
