Visual Studio Code 中的 HTML
Visual Studio Code 开箱即用地支持 HTML 编程。它支持语法高亮、智能补全（IntelliSense）以及可自定义格式。VS Code 还支持很棒的 Emmet。
IntelliSense
当您输入HTML时，我们会通过HTML IntelliSense提供建议。在下面的图片中，你可以看到建议的HTML元素闭包</div>以及一份针对特定情境的建议元素列表。
文档符号也可用于 HTML 格式，方便你通过 ID 和类名快速导航到 DOM 节点。
你也可以使用嵌入式CSS和JavaScript。但请注意，不会遵循其他文件的脚本和样式包含，语言支持只关注HTML文件的内容。
你可以随时按⌃空格（Windows，Linux Ctrl+空格）触发建议。
你还可以控制哪些内置代码补全服务提供者处于激活状态。如果你不想看到相应的建议，可以在用户或工作区设置中覆盖这些建议。
// Configures if the built-in HTML language suggests HTML5 tags, properties and values.
"html.suggest.html5": true
关闭标签
当输入开头标签时，标签元素会自动关闭。>
当输入该结束标签时，插入匹配的收盘标签。/
你可以用以下设置关闭自动关闭标签：
"html.autoClosingTags": false
自动更新标签
修改标签时，链接编辑功能会自动更新匹配的结尾标签。该功能为可选，可通过设置以下方式启用：
"editor.linkedEditing": true
色彩选择器
VS Code 的颜色选择器界面现在可以在 HTML 风格的部分提供。
它支持为从编辑器中获取的颜色配置色相、饱和度和不透明度。它还可以通过点击选择器顶部的颜色字符串，在不同颜色模式间切换。当你在颜色定义上方时，选择器会以悬停显示。
悬停
将鼠标移到HTML标签或嵌入样式和JavaScript上，可以获得光标下方符号的更多信息。
验证
HTML 语言支持对所有嵌入的 JavaScript 和 CSS 进行验证。
你可以用以下设置关闭这种验证：
// Configures if the built-in HTML language support validates embedded scripts.
"html.validate.scripts": true,
// Configures if the built-in HTML language support validates embedded styles.
"html.validate.styles": true
折叠
你可以用字槽上的折叠图标，在行号和行起始之间折叠源代码的部分区域。源代码中多行注释的所有HTML元素均可使用折叠区域。
此外，您可以使用以下区域标记来定义折叠区域：<!-- #region——>以及<!-- #endregion——>
如果你更喜欢切换到基于缩进的折叠来使用HTML：
"[html]": {
"editor.foldingStrategy": "indentation"
},
格式
为了改善HTML源代码的格式化，您可以使用格式化文档命令⇧⌥F（Windows Shift+Alt+F，Linux的Ctrl+Shift+I）来格式化整个文件，或者使用格式选择 ⌘K ⌘F（Windows，Linux Ctrl+K Ctrl+F）来格式化选中的文本。
HTML格式化器基于js-beautify。该库提供的格式选项可在 VS Code 设置中显示：
- html.format.wrapLineLength：每行字符数上限。
- html.format.unformatted： 不应该重新格式化的标签列表。
- html.format.contentUnformatted： 标签列表，逗号分隔，内容不应重新格式化。
- html.format.extraLiners： 标签列表，前应多一个换行。
- html.format.preserveNewLines：是否应保留元素前的现有换行。
- html.format.maxPreserveNewLines：一个区块中保留的最大换行数。
- html.format.indentInnerHtml：缩进
<头>以及<身体>分段。 - html.format.wrap属性属性的包裹策略：
自动：当行长超过时，展开武力：封装所有属性，除了先封装属性原力对齐：封装所有属性，除置于前，并对齐属性强迫-展开-多线：封装所有属性对齐多重：当行长超过时环绕，垂直对齐属性保护区：保持属性的包裹保护区阵营：保持属性的包裹但对齐
- html.format.wrap属性缩进大小：使用时的比对尺寸
原力一致以及排列多重在html.format.wrap属性或无效使用默认缩进大小。 - html.format.templating： Honor django、erb、handlebars 和 php 模板语言标签。
- html.format.unformattedContentDelimiter：将文本内容放在这串字符串之间。
提示：格式化器不会格式化
html.format.unformatted以及html.format.contentUnformatted设定。嵌入JavaScript格式化，除非排除“脚本”标签。
市场有多种替代格式化工具可供选择。如果你想用不同的格式化器，可以定义“html.format.enable”： false在你的设置里关闭内置格式化器。
埃米特片段
VS Code 支持 Emmet 片段扩展。Emmet缩写与其他建议和片段一起在编辑器自动补全列表中列出。
提示：请参阅Emmet速查表的HTML部分，了解有效的缩写。
如果你想在其他语言中使用 HTML Emmet 缩写，可以关联其中一种 Emmet 模式（例如CSS,HTML）以及其他具有
例如，在 JavaScript 中使用 Emmet HTML 缩写：
{
"emmet.includeLanguages": {
"javascript": "html"
}
}
我们还支持用户自定义片段。
HTML 自定义数据
你可以通过声明式自定义数据格式扩展 VS Code 的 HTML 支持。按设定
你可以在 vscode-custom-data repository 中了解更多关于如何使用自定义数据的信息。
HTML扩展
安装一个扩展以增加更多功能。进入扩展视图（⇧⌘X（Windows，Linux Ctrl+Shift+X）），输入“html”，查看相关扩展列表，帮助创建和编辑HTML。
提示：点击上方扩展瓷砖，阅读描述和评价，决定最适合你的扩展方案。更多内容请见市场。
下一步
继续阅读，了解：
- CSS、SCSS和Less——VS Code对CSS的支持一流，包括Less和SCSS。
- Emmet - 了解VS Code强大的内置Emmet支持。
- Emmet 官方文档——Emmet，网页开发者必备的工具包。
常见问题
VS Code 有 HTML 预览功能吗？
不，VS Code 没有内置的 HTML 预览支持，但 VS Code 市场中有扩展。打开扩展视图（⇧⌘X（Windows，Linux Ctrl+Shift+X）），在“实时预览”或“html预览”中搜索可用HTML预览扩展列表。