【翻译】Emmet (Zen Coding) 元素类型
元素类型
在 HTML 和 XML 文档中，当展开缩写时，所有缩写部分都实时转换成 HTML/XML 标签。但是某些标签——如 a 或者 img——转换成带有预定义属性的元素： <a href=""></a> 的 <img src="" alt="" />。Emmet 怎么知道什么时候添加所需的属性呢？
所有元素定义都以如下格式存放在 snippets.json 文件中：
{ "html": { "abbreviations": { "a": "<a href=\"\">", "link": "<link rel=\"stylesheet\" href=\"\" />" ... }, "snippets": { "cc:ie6": "<!--[if lte IE 6]>\n\t${child}|\n<![endif]-->" ... } }, "css": { ... } }
正像上面的代码展示的那样，第一级定义了语法名称。语法一节内元素定义被分成了两个小节： snippets（片段） 和 abbreviations（缩写）。
Snippets（片段）
Snippets（片段）就是普通的代码块，和所有程序编辑中的普通代码一样。可以在这一部分键入任何内容，它将被原样输出。
Abbreviations（缩写）
Abbreviations（缩写）是带有数据提示的真实构建块。由于 Emmet 常用于书写 HTML/XML 标签，缩写定义使用 XML 格式来描述元素。
Emmet 解析缩写定义并检索以下数据：
- 元素名；
- 默认属性；
- 属性的顺序；
- 属性的默认值；
- 元素的关闭标签。
仔细观察上面的 HTML 缩写定义。link 元素的定义是 <link rel="stylesheet" href="" /> （双绰号被 JSON 忽略；或者用单绰号代替）。这个定义是说此标签是用来生成 link 的缩写，它被命名为 link 并且饮食两个属性：带有默认值 “stylesheet” 的 rel 和带有空值的 href （严格遵造顺序），并且生成的元素包含关闭标签。
当 link 缩写被展开时，将得到如下 HTML 输出：
<link rel="stylesheet" href="">
允许覆盖默认属性或者添加新属性：
link[rel=prefetch title="Hello world"]
生成：
<link rel="prefetch" href="" title="Hello world">
还可以添加子元素，这将强制 Emmet 输出关闭标签：
link>xsl:apply-templates
将输出：
<link rel="stylesheet" href=""> <xsl:apply-templates></xsl:apply-templates> </link>
Aliases（别名）
在 snippets.json 的缩写一节，还能够定义别名：常用缩写的短写形式。别名能够用来定义：
- 长标签的短名字；
- 常用缩写的引用。
在 snippets.json 文件中，可以找到如下定义：
...
"html": {
"abbreviations": {
"bq": "blockquote",
"ol+": "ol>li"
}
}
上面的示例中，当展开 bq 缩写，Emmet 会找到 blockquote 缩写的定义。如果它不存在，将简单的输出 <blockquote></blockquote> 元素。ol+ 缩写的输出结果与 ol>li 相同。
ol+ 定义可能会产生歧义，因为它的末尾包含 + ， + 还是 sibling（兄弟）运算符。Emmet 正确地展开这些缩写，并且加号由于历史原因遗留了下来。需要记住的是，不要使用加号来创建缩写的别名。