sublime中html5的动态模板

最新推荐文章于 2023-07-07 19:21:32 发布

置顶 Grady_Ne

最新推荐文章于 2023-07-07 19:21:32 发布

阅读量168

点赞数

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

本文链接：https://blog.csdn.net/Grady_Ne/article/details/107616385

版权

sublime 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

如何查看特定文件的<scope>的值？ ctrl+shift+alt+p，点击copy即可，将其粘贴到<scope里面即可>

粘贴到<scope>标签里面即可。

1、form表单

<snippet>
	<content><![CDATA[
<form action="${1}" method="${2}">
	${3}
</form>
]]></content>
	<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
	<tabTrigger>form</tabTrigger>
	<!-- Optional: Set a scope to limit where the snippet will trigger -->
	<scope>text.html.basic</scope>
</snippet>

2、input 标签

<snippet>
	<content><![CDATA[
<input type="${1}" name="${2}" value="${3}">
]]></content>
	<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
	<tabTrigger>input</tabTrigger>
	<!-- Optional: Set a scope to limit where the snippet will trigger -->
	<scope>text.html.basic</scope>
</snippet>

3、用户名输入框

<snippet>
	<content><![CDATA[
<label for="username">用户名：</label><input type="text" name="username" placeholder="请输入用户名" id="username"> <br>
]]></content>
	<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
	<tabTrigger>username</tabTrigger>
	<!-- Optional: Set a scope to limit where the snippet will trigger -->
	<scope>text.html.basic</scope>
</snippet>

4、密码输入框

<snippet>
	<content><![CDATA[
<label for="password">密码：</label><input type="password" name="password" placeholder="请输入密码" id="password"> <br>
]]></content>
	<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
	<tabTrigger>password</tabTrigger>
	<!-- Optional: Set a scope to limit where the snippet will trigger -->
	<scope>text.html.basic</scope>
</snippet>

5、性别单选框

<snippet>
	<content><![CDATA[
性别：<input type="radio" name="gender" value="male" checked>男
	 <input type="radio" name="gender" value="female">女 <br>
]]></content>
	<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
	<tabTrigger>gender</tabTrigger>
	<!-- Optional: Set a scope to limit where the snippet will trigger -->
	<scope>text.html.basic</scope>
</snippet>

6、复选框checkbox

<snippet>
	<content><![CDATA[
<input type="checkbox" name="${1}" value="${2}">
]]></content>
	<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
	<tabTrigger>checkbox</tabTrigger>
	<!-- Optional: Set a scope to limit where the snippet will trigger -->
	<scope>text.html.basic</scope>
</snippet>

7、文本输入框text

<snippet>
	<content><![CDATA[
<label for="${4}">${1}</label><input type="text" name="${2}" placeholder="${3}" id="${4}"> <br>
]]></content>
	<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
	<tabTrigger>text</tabTrigger>
	<!-- Optional: Set a scope to limit where the snippet will trigger -->
	<scope>text.html.basic</scope>
</snippet>

8、超链接标签a的快捷输入方式

<snippet>
	<content><![CDATA[
<a target="${1}" href="${2}">${3}</a>
]]></content>
	<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
	<tabTrigger>a</tabTrigger>
	<!-- Optional: Set a scope to limit where the snippet will trigger -->
	<scope>text.html.basic</scope>
</snippet>

实时更新中。。。。。。。。