我有一个非常基本的 html 文件，如下所示：
然后我用 Live Preview 扩展打开它：
然后我点击了汉堡菜单并打开了\'Devtools Pane\'：
问题是为什么我的元素部分看起来像这样复杂：
但是，如果我用浏览器打开 html 文件并打开开发者工具，一切正常：
我尝试卸载并安装实时预览扩展，但这并不能解决问题。
有针对这个的解决方法吗？
提前致谢。
标签： html visual-studio-code browser live-preview
开发工具窗格看起来像这样，因为那是 Visual Studio Codes 开发人员工具窗格。您将看到 Visual Studio Code 使用的所有元素和脚本加你的文件。如果您通过命令面板在 Visual Studio Code 中打开开发人员工具，您将获得相同的结果。这不是此扩展程序所特有的。
This answer 提供了一些关于为什么会这样的见解，但基本上是因为构建了 Visual Studio Code像桌面应用程序但与基于网络的（喜欢？）技术例如 HTML 和 Javascript。
如果您正在寻找文档中的特定元素，我建议您使用开发工具左上角的元素选择器图标来检查它，它会自动将开发人员窗格中的 HTML 代码导航到您要检查的元素。或者，您也可以在浏览器中单独打开文件。
【讨论】：