使用Live Server插件可实现实时预览，安装后点击"Go Live"即可在浏览器中打开并自动刷新页面。
如果您在使用 VSCode 编辑 HTML 文件，但无法直接查看页面效果，可以通过多种方式快速预览和运行 HTML 项目。以下是几种常用的实现方法：
一、使用 Live Server 插件运行
Live Server 是 VSCode 中最流行的插件之一，能够启动一个本地开发服务器并支持实时刷新功能，适合用于静态网页的调试与展示。
1、打开 VSCode，点击左侧活动栏中的扩展图标（或按下Ctrl+Shift+X）进入扩展市场。
2、在搜索框中输入
Live Server，找到由 Ritwick Dey 开发的官方插件并点击安装。
立即学习“前端免费学习笔记（深入）
”；
3、安装完成后，打开一个 HTML 文件，在文件顶部或右键菜单中点击"Go Live"按钮。
4、默认
浏览器将自动打开，并显示当前 HTML 页面内容，任何代码修改都会实时刷新页面。
二、通过内置调试功能运行
VSCode 支持结合 Debugger for Chrome 或 Edge 扩展来直接在浏览器中调试 HTML 页面，适用于需要断点调试的场景。
1、确保已安装
Debugger for Chrome或Debugger for Edge插件。
Comet AI 浏览器下载 Comet AI 浏览器，体验由 Perplexity AI 驱动的革命性上网方式。内置 AI 助手可实时总结网页、跨标签页对比信息、自动执行任务。告别繁琐操作，让 AI 成为你的浏览副驾，大幅提升研究与工作效率。支持 Windows、macOS、Android 和 iOS。
下载
2、在项目根目录下创建
.vscode/launch.json配置文件。
3、添加启动配置，设置 type 为"chrome"或"edge"，指定 HTML 文件路径。
4、按
F5启动调试会话，浏览器将以调试模式打开页面。
三、直接用浏览器打开 HTML 文件
对于简单的 HTML 项目，无需启动服务器也可通过本地文件协议查看页面，操作简单且无需额外插件。
1、在 VSCode资源管理器中右键点击目标 HTML 文件。
2、选择
"Reveal in File Explorer"定位到文件所在位置。
3、右键该文件并选择“打开方式”，选择已安装的浏览器（如 Chrome、Firefox 等）。
4、浏览器将以
file:///协议加载页面，适用于无跨域请求的静态内容。