如何通过Sublime Text配置HTML自动完成的详细步骤

新闻中心 NEWS CENTER

您当前位置：首页 > 新闻中心 > 网络学院

如何通过Sublime Text配置HTML自动完成的详细步骤

2025-11-16

浏览次数：次

返回列表

启用自动补全、安装Emmet插件、配置Tab键触发和自定义代码片段可显著提升Sublime Text中HTML编码效率，具体步骤包括开启auto_complete与auto_match_enabled选项，通过Package Control安装Emmet，绑定expand_abbreviation_by_tab命令，并创建如art生成article标签的Snippet。

如何通过sublime text配置html自动完成的详细步骤

在使用 Sublime Text 编写 HTML 时，开启自动完成功能可以显著提升编码效率。Sublime Text 默认已具备基础的自动补全能力，但通过一些配置和插件增强，可以让 HTML 自动完成更智能、更高效。

1. 启用内置自动补全功能

Sublime Text 自带基本的自动补全支持，确保该功能已启用：

打开菜单栏 Preferences > Settings
在右侧用户设置中添加或确认以下选项为 true： "auto_complete": true,
"auto_match_enabled": true
auto_complete 控制是否弹出补全提示
auto_match_enabled 可自动闭合标签、引号等

2. 安装 Emmet 插件（推荐）

Emmet 是提升 HTML 编写速度的核心工具，支持缩写快速生成完整结构。

按下 Ctrl+Shift+P 打开命令面板
输入 “Install Package Control”，若未安装先执行此步骤
再次打开命令面板，输入 “Package Control: Install Package”
搜索并安装 Emmet

安装后无需额外配置，即可使用如输入 html:5 然后按 Tab 键生成完整的 HTML5 模板。

Visla

AI视频生成器，快速轻松地将您的想法转化为视觉上令人惊叹的视频。

100 查看详情 Visla

3. 配置按键触发自动完成

有时需要手动触发补全建议框，可通过按键绑定优化体验：

进入 Preferences > Key Bindings
在用户键位设置中添加： { "keys": ["tab"], "command": "expand_abbreviation_by_tab", "context": [
{ "key": "selection_empty", "operator": "equal", "value": true },
{ "key": "selector", "operator": "equal", "value": "text.html" }
] }
这样在 HTML 文件中输入 div 再按 Tab 就会自动转为