在 Visual Studio Code (VSCode) 中自定义 HTML 模板可以通过使用代码片段方式实现:
使用代码片段(Snippets)
VSCode 支持为特定语言添加代码片段,以下是自定义 HTML 模板的步骤:
打开用户代码片段设置:
- 按
Ctrl+Shift+P
(Windows/Linux)或Cmd+Shift+P
(macOS)。 - 输入
Preferences: Configure User Snippets
并选择该选项。 - 在弹出的列表中选择
html
。
编辑 HTML 代码片段文件:
-
如果文件不存在,会自动创建。
-
添加如下代码来定义一个自定义模板:
{
"Custom HTML Template": {
"prefix": "!h",
"body": [
"<!DOCTYPE html>",
"<html lang=\"zh-CN\">",
"",
"<head>",
" <meta charset=\"UTF-8\">",
" <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">",
" <title></title>",
"</head>",
"",
"<body>",
" ",
"</body>",
"",
"</html>"
],
"description": "自定义 HTML 模版"
}
}
使用模板:
- 在 HTML 文件中,输入
!h
然后按Tab
键即可插入模板。