Sublime怎么在浏览器里预览HTML_创建OpenInBrowser快捷键教程

安装Open In Browser插件或通过自定义快捷键、构建系统实现Sublime Text中HTML文件一键浏览器预览。

Sublime怎么在浏览器里预览HTML_创建OpenInBrowser快捷键教程

如果您编写了HTML文件并希望快速在浏览器中查看效果,但Sublime Text默认没有提供直接预览的功能,您可以通过配置快捷键实现一键在浏览器中打开文件。以下是几种实现方式:

一、安装Open In Browser插件

通过Package Control安装Open In Browser插件可以快速实现浏览器预览功能,该方法适合不熟悉手动配置的用户。

1、按下 Ctrl+Shift+P 打开命令面板。

2、输入 Install Package 并选择对应选项。

立即学习前端免费学习笔记(深入)”;

3、等待包管理器加载完成后,搜索 Open In Browser 并点击安装。

4、安装完成后,右键点击HTML文件,选择 Open in Browser 即可在默认浏览器中预览。

二、手动创建快捷键绑定

通过自定义键盘快捷方式,将打开浏览器的操作绑定到指定组合键,提升操作效率。

1、点击菜单栏的 Preferences → Key Bindings,打开键位映射文件。

2、在右侧用户键位设置中添加如下代码:

Sublime怎么在浏览器里预览HTML_创建OpenInBrowser快捷键教程

Upscalepics

在线图片放大工具

Sublime怎么在浏览器里预览HTML_创建OpenInBrowser快捷键教程44

查看详情 Sublime怎么在浏览器里预览HTML_创建OpenInBrowser快捷键教程

{ “keys”: [“ctrl+alt+b”], “command”: “open_in_browser” }

3、保存文件后,打开HTML文件并按下 Ctrl+Alt+B 即可使用默认浏览器预览当前页面。

三、配置自定义Build System

通过创建新的构建系统,调用系统命令在浏览器中打开HTML文件,适用于需要灵活控制打开行为的场景。

1、点击菜单栏的 Tools → Build System → New Build System

2、输入以下内容(以Windows为例):

{ “cmd”: [“start”, “”, “$file”], “shell”: true }

3、将文件保存为 OpenInBrowser.sublime-build

4、打开HTML文件后,按下 Ctrl+B 即可启动构建并在浏览器中预览。

sublime html windows 浏览器 win html windows sublime text

上一篇
下一篇