Visual Studio Code自定义html5模板

作者：管理员 2018-10-25 20:05:14 分类：别出心裁-妙阅读（11552） 7

现如今前端用的最多开发工具恐怕就是Visual Studio Code，但我们每次新建html模板时候，是否总是感觉太单调，如果能像其他编辑器样能定制一套属于自己的模板那该多好，其实是完全可以的的

找到html.json文件

右上角文件 ->首选项 -> 用户代码片段 ->html.json文件，如下图

当然，喜欢命令的小伙伴也可以直接：键盘快捷键Ctr+Shift+P搜索关键字snippet，回车，选择列表上html

不管怎么样，你最终打开的大概就是如下图这么个文件，内容也许有所不同，格式是不是就这么回事儿？

打造自己的模板

1
2
3
4
5
6
7
8
9
10
11
12
13

{
"full sample": {
"prefix": "html 自定义模板", //对应的是你使用这个模板时候的快捷键，当你输入html就会出现对应的一堆木板，其中就有个“html 自定义模板”
"body": [
"<!DOCTYPE html>\n\n<head>\n\t<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">\n\t<meta name="viewport" content="width=device-width, initial-scale=1">\n\t<meta name="keywords" content="关键词">",
"\t<meta name="description" content="网站描述">\n\t<title>网站标题</title>",
"\t<script type="text/javascript" src="https://www.baidu.com"> </script>\n</head>\n\n<body>",
"\t<div id="container"></div>",
"</body>\n\n</html>"
],
"description": "The full sample code - 我是一个模板"
}
}

注意，它是个json格式文件，那么很显然，你可以再次编辑N多个模板供你使用

简单说说几个常用转义字符含义

1
2
3
4

\t \r \n都是转义字符，空格就是单纯的空格，输入时可以输入空格
\t 的意思是横向跳到下一制表符位置
\r 的意思是回车
\n 的意思是回车换行

本站所有文章、图片、资源等如无特殊说明或标注，均为来自互联网或者站长原创，版权归原作者所有；仅作为个人学习、研究以及欣赏！如若本站内容侵犯了原著者的合法权益，可联系我们进行处理，邮箱：343049466@qq.com

赞(8) 打赏

标签：

上一篇：VUE中Vue.nextTick()和this.$nextTick()

下一篇：Vue.js中ref 及 $event 事件对象

Visual Studio Code自定义html5模板

找到html.json文件

打造自己的模板

简单说说几个常用转义字符含义

相关推荐

共 7 条评论关于"Visual Studio Code自定义html5模板"

点击取消