从零开始学习HTML+CSS（3）Emmet常用示例

Emmet常用示例
0.以Sublime Text3为例，默认在输入快捷代码后按 Ctrl+e 得到代码片段
下面是一些常见示例及使用方法
1.
功能：自动补全html标签
快捷代码：!
注意：此处应输入英文中的!
示例：
输入

按 Ctrl+e 得到

2.
功能：自动生成开始标签和结束标签
快捷代码：输入任何标签关键词，如p,h1,div等
注意：仅需要输入英文字母或单词
示例：
输入

按 Ctrl+e 得到

3.
功能：自动补全
快捷代码：在css中，输入需要定义长度（大小）的属性标签首字母及长度（大小）值，也可以是百分比
注意：仅在css外部样式表和内部样式表中可以使用，输入数值时是否带单位都不影响
示例：
输入

按 Ctrl+e 得到

输入

按 Ctrl+e 得到

4.
功能：自动补全css外部样式表引入
快捷代码：link:css
示例：
输入

按 Ctrl+e 得到

----------11.2更新----------
5.
功能：自动生成开始标签、结束标签并规定类
快捷代码：标签名称.类名
示例：
输入

	div.nav

按 Ctrl+e 得到

	<div class="nav"></div>

功能：自动生成开始标签、结束标签并规定多个类
快捷代码：标签名称.类名1.类名2
示例：
输入

	div.box1.box2

按 Ctrl+e 得到

	<div class="box1 box2"></div>

功能：自动生成开始标签、结束标签并规定id
快捷代码：标签名称.id名
示例：
输入

	p#para1

按 Ctrl+e 得到

	<p id="para1"></p>