雨丽吖_3967
2026-05-11
298人浏览
原创
WebStorm 默认开启HTML标签自动闭合，但常因Smart Keys中“Insert pair tag”未勾选、省电模式启用或右下角语言模式非HTML而失效；需依次检查Settings→Editor→General→Smart Keys、右下角状态栏及Power Save Mode。
WebStorm 默认开启 HTML 标签自动闭合，但常因设置被误关、省电模式启用或语言级别不匹配而失效——不是 bug，是配置没对。
这是最常被忽略的开关。即使你输入 <div>，若该选项关闭，WebStorm 不会自动生成 <code>
File → Settings → Editor → General → Smart Keys
Insert pair tag（注意不是“Insert pair quote”或 bracket）Insert required attributes，比如输入 <img> 时自动补 src 和 alt
.html 文件生效；.vue 中需额外配置语言注入或使用插件支持省电模式会静默禁用所有代码补全、括号配对、标签闭合等智能辅助功能，界面右下角有图标提示，但容易被忽略。
Power Save Mode 是否已勾选Ctrl+Q）、实时高亮和结构导航，影响远不止闭合标签WebStorm 按文件后缀和语言模式决定启用哪套规则。哪怕文件名是 index.html，如果右下角显示的是 Plain Text 或 XML，自动闭合就完全不触发。
HTML
HTML（不是 HTML (Angular) 或 Vue HTML）Settings → Languages & Frameworks → Schemas and DTDs 中手动指定了旧版 DTD，可能干扰解析逻辑File → New → HTML File，而非右键新建空文本再改后缀这个不直接影响闭合行为，但会影响你肉眼判断是否“已闭合”——比如 <img> 和 <img> 看起来一样，但后者在某些校验工具中报错。
Settings → Editor → Code Style → HTML → Other
In empty tag：让自闭合标签如 <img src="a.jpg"> 自动加空格，符合 HTML5 规范且兼容性更好<input type="text"> 这种紧凑写法，虽可运行，但易与 XHTML 混淆，团队协作时建议统一开启Ctrl+Alt+L）时生效，不影响输入时的实时闭合真正卡住的点往往不在“怎么开”，而在“为什么开了还不动”——多是省电模式开着、语言模式错了、或者你在 .vue 里硬套 HTML 设置。先盯住右下角那个小标签，再查 Smart Keys，90% 的问题当场解决。
相关文章
如何清理 PHP7.4 上传漏洞入侵后的后门文件
WebStorm怎么安装React开发代码提示插件
WebStorm修改界面字体间距设置教程
如何使用PhpStorm全局查找匹配文件
WebStorm常用插件如何批量更新？高效管理操作步骤
相关标签:
webstorm本站声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
相关专题
webstorm 提供四种放大代码编辑器的方法：键盘快捷键：ctrl/cmd + plus菜单：查看 > 缩放 > 放大工具栏：缩放按钮鼠标滚轮：按住 ctrl/cmd 滚动。本专题为大家提供相关的文章、下载、课程内容，供大家免费下载体验。
2024.04.08
1242
8
解决 webstorm 闪退问题的步骤：检查更新；重新启动计算机；禁用插件；重置设置；清除缓存；检查防火墙和防病毒软件；重新安装 webstorm；联系支持团队。本专题为大家提供相关的文章、下载、课程内容，供大家免费下载体验。
2024.04.08
1127
6
webstorm无法运行文件的原因：node.js 版本不匹配；文件路径错误；环境变量未设置；文件依赖项丢失；权限问题；防火墙拦截；webstorm 插件冲突；webstorm 错误。想了解更多webstorm的相关内容，可以阅读本专题下面的文章。
2024.04.08
3782
12
可以通过三种方法调整 webstorm 的字体大小：快捷键（windows/linux：ctrl + alt + (+或-)；macos：cmd + alt + (+或-)）、菜单（文件 > 设置 > 外观与行为 > 外观 > ide 字体大小）、注册表（仅限 windowshkey_current_user\software\jetbrains\webstorm\192.7785.53\options\edit
2024.04.08
1362
13
webstorm创建html项目分五步：创建新项目并配置 html 设置；添加新 html 文件；编写 html 代码并利用实时预览；预览 html 文件并进行部署；使用模板和 emmet 快捷方式加快开发。想了解更多webstorm的相关内容，可以阅读本专题下面的文章。
2024.04.08
4990
12
webstorm新建文件夹方法：在项目视图中导航到目标位置；右键单击并选择“新建”>“文件夹”；输入文件夹名称并单击“确定”。想了解更多webstorm的相关内容，可以阅读本专题下面的文章。
2024.04.08
1295
12
启动方法：1、打开webstorm：启动 webstorm 应用程序；2、创建或打开项目：创建新项目或打开现有项目；3、配置项目：选择项目类型和解释器，配置其他项目设置；4、开始编码：创建文件并编写代码，webstorm 将自动提供代码功能；5、运行项目：右键单击相关文件并选择“启动文件”或“启动”。
2024.04.08
3653
11
更改方法：打开 webstorm 设置；导航到“appearance & behavior”>“language & fonts”；在“user interface language”中选择“chinese (simplified)”或“chinese (traditional)”；重启 webstorm界面将显示为中文。想了解更多webstorm的相关内容，可以阅读本专题下面的文章。
2024.04.08
4636
13
webstorm专为web开发量身定制，提供针对web开发语言的强大功能，而intellij idea是支持多种语言的多功能ide。它们的差异主要在于语言支持、web开发特性、代码导航、调试和测试功能、附加特性。最终选择取决于语言偏好和项目需求。本专题为大家提供相关的文章、下载、课程内容，供大家免费下载体验。
2024.04.09
7628
6
热门下载
相关下载
精品课程
