HTML/CSS速写 Emmet | 使用方法

安装

我使用的IDE是MacOS上的Brackets。Brackets在墙内安装插件的地址如下：

https://brackets-registry.abo...
下载Zip拖入到拓展管理器安装即可。

---

HTML篇

生成HTML模版

HTML5模版

输入!或html:5，然后按下Tab键即可

其他HTML模版

• html:5 + Tab 或者 ! 生成 HTML5 结构
• html:xt + Tab 生成 HTML4 过渡型
• html:4s + Tab 生成 HTML4 严格型

---

生成带有 id 、class 的 HTML 标签

1. E 代表HTML标签。
2. E#id 代表id属性。
3. E.class 代表class属性。
4. E[attr=foo] 代表某一个特定属性。
5. E{foo} 代表标签包含的内容是foo。
6. E>N 代表N是E的子元素。
7. E+N 代表N是E的同级元素。
8. E^N 代表N是E的上级元素。

分组（）与重复多份*

用括号进行分组，表示一个代码块，分组内部的嵌套和层级关系和分组外部无关。
需要多少份结构，就在后面乘以几

---

CSS篇

---

更详细的使用方法见：

http://bubkoo.com/2014/01/04/...在-sublime-text-3-中安装-emmet