微信公众号 讲师中心
首页
文章
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 自媒体 新闻
专题
后端开发 web前端 数据库 开发工具 php框架 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 新闻
AI工具
AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令
学习
大前端 后端开发 数据库 移动端 运维开发 计算机基础
编程手册
大前端 后端开发 数据库 移动端 运维开发 计算机基础
下载
js特效 网站源码 工具下载 类库下载 网站素材 学习资源 插件扩展 手机/移动开发 手机游戏
搜索
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程
自媒体 新闻
首页 > 开发工具 > VSCode > 正文

怎么使用浏览器查看VSCode写的代码

angryTom
发布： 2020-02-10 14:46:28
原创
7194人浏览过

vscode默认是在控制台下查看html文件，对于我们查看和调试都很不方便，那如何在浏览器中打开呢？

怎么使用浏览器查看VSCode写的代码

怎么使用浏览器查看VSCode写的代码

1、新建一个HTML文件

1.png

2、点击左侧的扩展，打开扩展栏

2.png

3、在扩展栏的搜索栏中输入open in browser，找到open in browser这款插件，点击右下角“安装”字样即可安装。

3.png

代码小浣熊
代码小浣熊

代码小浣熊是基于商汤大语言模型的软件智能研发助手，覆盖软件需求分析、架构设计、代码编写、软件测试等环节

代码小浣熊 51
查看详情 代码小浣熊

4、回到刚开始建的HTML文件，在文件中鼠标右键单击，在弹出的窗口中选择使用默认浏览器打开或者其他浏览器打开，也可以使用我们上面说的快捷键（Alt + B或Shift+Alt+B）打开。

4.png

6、你想用其他浏览器打开，就选择Open In Other Browsers（Shift+Alt+B，顶部会出现一个命令框，其中会显示可以使用的浏览器，选择自己需要的浏览器即可，在此，我们使用chrome打开。

5.png

6.png

相关文章教程推荐：vscode教程

以上就是怎么使用浏览器查看VSCode写的代码的详细内容，更多请关注php中文网其它相关文章！

相关标签：
浏览器 vscode chrome html vscode

大家都在看：

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。

下载
来源：php中文网
收藏 点赞
上一篇：vscode菜单栏与工具栏隐藏之后怎么找回来 下一篇：vscode中如何运行c程序
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
作者最新文章
最新问题
在VSCode中配置OCaml开发环境 首先安装OCaml编译器与opam包管理器，再安装OCamlPlatform等VSCode扩展，接着通过opam安装ocamllsp和dune，最后创建dune项目并编写代码，实现语法高亮、智能提示与构建调试功能。
2025-11-11 02:21:09
822
如何在VSCode中配置Java开发环境 首先安装JDK11或17并配置JAVA_HOME与PATH，验证java-version；接着在VSCode中安装ExtensionPackforJava；然后创建含src目录的项目，编写Java文件并右键运行；最后可选Maven初始化项目并由VSCode自动加载pom.xml管理依赖。
2025-11-11 01:53:11
711
vscode如何同步扩展市场配置_vscode扩展市场偏好设置同步方法 一、使用VSCode的SettingsSync功能，通过Microsoft或GitHub账户同步扩展列表；二、通过命令行导出extensions.txt文件并在目标设备安装，实现扩展批量迁移；三、手动复制settings.json中的推荐或忽略配置，保持扩展市场筛选偏好一致。
2025-11-11 01:29:30
715
vscode怎么全局搜索markdown内容_vscode全局搜索markdown文件文本的详细方法 使用Ctrl+Shift+F打开搜索面板，输入关键词后在“文件筛选”框中输入.md限定为Markdown文件，可添加路径如docs/.md进一步缩小范围，通过正则、大小写匹配等选项提升效率，点击结果直接跳转定位内容。
2025-11-10 23:39:16
450
如何卸载windows7上的vscode32位_vscode32位在win7系统卸载方法 首先通过控制面板卸载VSCode，进入“程序和功能”找到MicrosoftVisualStudioCode并卸载；随后手动删除残留文件夹，包括安装目录C:\Users\用户名\AppData\Local\Programs\MicrosoftVSCode和用户数据目录C:\Users\用户名\AppData\Roaming\Code；最后可选清理开始菜单快捷方式，确保系统无残留配置，避免后续冲突。
2025-11-10 23:38:02
900
vscode同步插件能同步扩展吗_vscode同步插件扩展同步功能使用说明 首先启用VSCode设置同步功能，登录Microsoft或GitHub账户并选择同步内容类型；接着在新设备登录相同账户即可下载配置，扩展将自动安装；用户可手动调整同步项如扩展、快捷键等；若同步失败，可通过状态栏图标检查状态并重新登录或手动触发同步。
2025-11-10 23:37:27
718
vscode如何同步编辑器字体设置_vscode编辑器字体与字号同步方法 通过SettingsSync、手动导出settings.json或使用脚本可实现VSCode字体字号同步。1、登录GitHub启用SettingsSync同步配置；2、导出包含"editor.fontFamily"和"editor.fontSize"的settings.json并在其他设备导入；3、用脚本批量部署统一配置，确保多设备编辑体验一致。
2025-11-10 23:20:02
481
深入掌握VSCode Unity游戏开发调试技巧 配置VSCode调试环境需安装C#DevKit及DebuggerforUnity扩展，设置Unity外部编辑器为VSCode并生成launch.json与tasks.json文件，确保"program"指向Unity可执行文件，启用自动附加功能以实现运行时断点调试。
2025-11-10 23:18:03
161
在VSCode中配置Ruby开发环境与调试设置 安装Ruby扩展、配置解释器路径、安装solargraph与调试gem、设置launch.json后即可在VSCode中调试Ruby代码。
2025-11-10 22:51:36
455
vscode如何全局搜索打开的文件_vscode在已打开文件中全局搜索内容的方法 使用Ctrl+F在当前文件中搜索关键词并高亮显示；2.通过命令面板结合包含模式限制搜索范围以实现仅在已打开文件中查找；3.按Ctrl+Shift+F进行项目全局搜索，支持正则与全词匹配；4.用Ctrl+P快速打开文件后结合文件内搜索定位内容。
2025-11-10 22:34:02
745
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部