使用live server扩展可实现实时预览，安装后右键html文件选择open with live server即可在浏览器中实时查看效果。
如果您在使用 Visual Studio Code 编辑 HTML 文件，但无法直接查看页面效果，可以通过多种方式快速运行并预览网页内容。以下是几种常用的运行 HTML 的方法：
一、使用 Live Server 扩展
Live Server 是 VSCode 中最受欢迎的扩展之一，能够启动一个本地开发服务器，并支持实时刷新功能，方便前端开发调试。
1、打开 VSCode，点击左侧活动栏的扩展图标（或按下 Ctrl+Shift+X）。
2、在搜索框中输入 Live Server，找到由 Ritwick Dey 开发的 "Live Server" 扩展并安装。
立即学习“前端免费学习笔记（深入）”；
3、安装完成后，右键点击要运行的 HTML 文件，在上下文菜单中选择 Open with Live Server。
4、默认浏览器将自动打开并显示该 HTML 页面，任何代码修改都会实时刷新。
二、直接在浏览器中打开 HTML 文件
无需安装额外工具，通过系统默认浏览器手动打开文件也是一种简单有效的预览方式。
1、在 VSCode 中保存当前编辑的 HTML 文件，确保文件扩展名为 .html。
2、前往文件所在目录，使用资源管理器或 Finder 右键点击该文件。
3、选择“打开方式”，然后选择您常用的浏览器（如 Chrome、Edge 或 Firefox）。
4、浏览器窗口将加载并显示页面内容，适合静态内容查看。
三、配置任务运行 HTML
通过自定义任务，可以实现使用命令行工具启动简易 HTTP 服务来运行 HTML 文件。
1、确保系统已安装 Python，推荐 Python 3.x 版本。
2、在项目根目录下打开终端（Terminal），输入以下命令启动服务器：
python -m http.server 8000。
3、打开浏览器，访问地址 http://localhost:8000 即可查看网页。
4、此方法适用于需要模拟真实服务器环境的场景，例如 AJAX 请求或模块导入。
四、使用 Code Runner 扩展
Code Runner 支持多种语言的快速执行，配合设置后也可用于运行 HTML 文件。
1、在扩展市场中搜索并安装 Code Runner（由 Jun Han 提供）。
2、安装完成后，点击右上角的“播放”按钮，或右键选择 Run Code。
3、若未自动用浏览器打开，可在设置中配置默认行为，指定 HTML 文件使用浏览器打开。
4、可通过修改 settings.json 添加如下配置：
"code-runner.executorMap": { "html": "start $fileName" }（Windows 系统适用）。
