vscode——自定义html模板

最新推荐文章于 2025-06-06 22:20:35 发布

Lin_熊米

最新推荐文章于 2025-06-06 22:20:35 发布

阅读量304

点赞数

CC 4.0 BY-SA版权

分类专栏： vscode 文章标签： vscode html

本文链接：https://blog.youkuaiyun.com/xiongmi_Lin/article/details/121283378

vscode 专栏收录该内容

2 篇文章

订阅专栏

这篇博客介绍了如何在Visual Studio Code中创建自定义的HTML代码片段，通过`h5template`前缀快速生成基本HTML5结构，提高前端开发效率。用户可以在首选项设置中搜索html.json来编辑和管理个人代码片段。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

操作流程：文件 --> 首选项 --> 用户片段 --> 搜索html.json

{
	// Place your snippets for html here. Each snippet is defined under a snippet name and has a prefix, body and 
	// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the 
	// same ids are connected.
	// Example:
	// "Print to console": {
	// 	"prefix": "log",
	// 	"body": [
	// 		"console.log('$1');",
	// 		"$2"
	// 	],
	// 	"description": "Log output to console"
	// }
	"h5 template" :{
		"prefix": "h5 template",  // 敲这个代码就会生成html片段
		"body": [
			"<html lang=\"en\">",
			"\t<head>",
			"\t\t<title>标题</title>",
			"\t</head>",
			"\t<body>",
			"\t</body>",
			"</html>"
		]
	}
}