vscode HTML标签子标签无法相对于父标签缩进

最新推荐文章于 2025-11-30 10:27:17 发布
原创 最新推荐文章于 2025-11-30 10:27:17 发布 · 1.3k 阅读 · 1 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
标签
#vscode #html5
在重装VSCode后发现HTML标签子标签无法自动缩进，通过新建HTML文件并设置「从内容中检测缩进方式」解决了该问题。此方法可能对遇到相同困扰的前端开发者有所帮助。

        因为一些问题，重装了vscode后发现，HTML标签子标签无法相对于父标签缩进，具体情况就是在写完div标签后换行写img标签，但img标签无法自动缩进。

 

 

         在网上也没找到解决方法，还好最后解决了这个问题，在这里记录一下，希望对遇到相同问题的人有所帮助。

        解决方法：

        新建一个HTML文件,点击右下角的 空格：4

        

         点击后会出现下面这样的列表：

 

        最后选择 从内容中检测缩进方式

        经过测试问题解决！

 

晴空的code
关注
vue使用v-html保留原内容的缩进和换行
chaodaibing的博客
08-22 935
v-html实现缩进和换行
关于v-html疑难杂症
qq_52722039的博客
11-22 768
我有一个问题是把word的好多好多内容都需要写在页面上，好几个word都是一样的，标题，段落（可能有的也不大一样，这都不重要了）我还需要把里面的其中几个数字给放大，给加粗，给他换个颜色，在data中定义变量，可以写标签可以加上class类名，欸，加不上，这可把气的。关于v-html疑难杂症，html，语义，v-html，vue3.2，ts，js
vue文件代码缩进以及格式化代码 [自定义]
qq_43294510的博客
04-15 2696
文件->首选项->设置->文本编辑器-> 找到setting.json 替换以下内容. { "files.autoSave": "afterDelay", "files.autoSaveDelay": 3000, "files.associations": { "vue-html": "html", "vue": "h...
我遇到的VS code代码格式化对齐及编码格式问题和解决方法
weixin_46061455的博客
04-20 5461
该文章仅仅是我使用VScode遇到的一些问题与解决方法的记录
vscode基本配置(格式化,缩进)
linlinlinhtml_的博客
04-17 3880
{ “files.autoSave”: “afterDelay”, //自动保存 “editor.detectIndentation”: false, “editor.tabSize”: 4,//缩进四格 “editor.formatOnSave”: true, “eslint.autoFixOnSave”: true, “eslint.validate”: [ “javascript”, “ja...
为什么你的VSCode HTML缩进总是出错？真相终于曝光
QuickDebug的博客
11-12 905
解决VSCode HTML缩进混乱问题，掌握正确设置方法。本文详解如何统一VSCode HTML的缩进空格，涵盖文件配置、格式化工具与团队协作场景，确保代码整洁一致。关键技巧一目了然，值得收藏。
HTML代码整洁如一，你不可错过的VSCode 4个缩进优化技巧
最新发布
CompiShoal的博客
11-30 922
让HTML代码整洁如一，掌握VSCode HTML缩进空格设置是关键。本文分享4个实用技巧：统一缩进为2或4空格、自动格式化文档、启用格式化规则和文件关联配置。适用于前端开发与团队协作，提升代码可读性与维护效率。值得收藏
HTML代码格式化总出错，你必须知道的4个VSCode缩进避坑指南
QuickProceed的博客
11-30 650
解决VSCode HTML缩进混乱问题，掌握4个关键设置技巧。涵盖自动格式化配置、缩进空格数调整、文件关联规则及格式化工具优先级，确保代码整洁统一。适用于前端开发与团队协作场景，提升编码效率，值得收藏。
vscode快捷键及html标签
qq_71476546的博客
10-31 4995
1.ctrl+s：保存2.ctrl+a：全选3.ctrl+x、ctrl+c、ctril+v：剪切、复制、全选4.ctrl+z、ctrl+y：撤销、前进5.shift+end：从头选中一行6.shift+home：从尾部选中一行7.shift+alt+↓：快速复制一行8.alt+↓ 或 ↑：快速移动一行9.tab：向后缩进10.tab+shift：向前缩进11.alt+鼠标左键：多光标12.ctrl+d：选择相同元素的下一个13.ctrl+/：快速添加注释。
html 取消列表缩进,关于html：如何从无序列表项中删除缩进？
weixin_29726381的博客
07-01 1905
缩进是一种简单的CSS单行代码：ul { padding-left: 1.2em; }A leading line of paragraph textBullet points align with paragraph text above.Long list items wrap around correctly. Long list items wrap around correctly. L...
vs code 在修改一些设置之后enter键换行不自动缩进
qq_32052369的博客
08-06 5689
vs code 在修改一些设置之后enter键换行不自动缩进，一一排查之后发现是因为这个设置 》文件》首选项》设置 如果像我一样是在找不到是哪个位置，可以点击下图右上角的按钮 然后出现setting.json文件 找到// "editor.autoIndent": "none", 如果不知道改成什么 可以直接注释或者删除掉 光标就可以自动缩进了 不能缩进的示例（没有注释掉"editor.autoIndent": "none",）： ...
vscode view标签不能自动闭合
liurk_hh的博客
06-24 2038
vscode 标签自动闭合
Vue第 50 篇，Vscode第 4 篇，Vue代码使用格式化文档无效，Vscode使用格式化文档无效
热门推荐
前端架构师（AI + GIS + Web3D）& 数字芯片系统架构师（FPGA），NorthCity Smile的博客（NcSmile，博主域名：https://ncmile.blog.csdn.net）
04-11 1万+
⭐最近在写代码的时候，Vscode 使用格式化文档不管用，原因竟然是单页面使用大量element 组件 和 html 代码导致，Vscode识别不了该文件。简单记录一下
vscode html 换行设置
weixin_43794095的博客
02-16 2826
【代码】vscode html 换行设置。
VScode自动格式化代码（tab缩进、符号空格）配置beautify插件使用
weixin_48263890的博客
02-06 6610
VScode配置自动格式化beautify插件
vs单独设置html缩进
小白的博客
12-06 1943
vscode 默认的html 语言的缩进有点过，貌似一个tab6个space， html看起来太空了，所幸的是可以自己调整单个语言的缩进模式。 方法如下： Preferences: Open User Settings 添加下列内容 "[html]": { "editor.tabSize": 2, "editor.insertSpaces": false }, 转自：https://www.cnblogs.com/zelos/p/7231681.html ...
Vs code代码保存后自动缩进的设置步骤
qq_45300235的博客
07-13 3336
注：如果有要安装的插件，会有提示，安装后即可使用。
【Web开发必备技能】：3步搞定VSCode HTML格式化缩进设置
BreakVein的博客
11-03 814
轻松掌握VSCode HTML格式化缩进设置，3步完成个性化配置。适用于前端开发、团队协作场景，支持自动对齐、统一代码风格，提升编码效率与可读性。图文详解设置方法，简单易操作，值得收藏。
vscode如何设置缩进为两个空格？
luolei0636的博客
07-01 2604
vscode设置缩进为两个空格 点击左下角“管理”图标，点击“设置”项，打开设置面板。 在设置面板输入“tab”，找点击“常用设置”，将Tab Size改成“2”。 修改js-css-html formatter插件中的缩进（未装此插件可忽略） 在vscode编辑器中按“F1”，在弹出面板中输入“Formatter Config”，然后点击打开，将formatter.json中的全部“indent_size”项改为“2”，然后重启vscode。 ...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值