Emmet语法快速上手

学习视频

Emmet爆速开发

学习文档

Emmet在线文档

Emmet介绍

Emmet (前身为 Zen Coding) 是一个能大幅度提高前端开发效率的工具，能够实现 HTML、CSS 的快速编写。vscode已经第三方支持Emmet，无需安装插件，直接使用Tab键或者回车键

使用Emmet好处

通常大多数的文本编辑器都会允许我们存储和重用一些代码块，我们称之为“片段”。虽然片段能很好地推动我们的生产力，但大多数的实现都有这样一个缺点：我们必须先定义代码片段，并且不能再运行时进行拓展。 而 Emmet 把片段这个概念提高到了一个新的层次：我们可以设置 CSS 形式的能够动态被解析的表达式，然后根据输入的缩写来得到相应的内容。Emmet 很成熟的并且非常适用于编写 HTML/XML 和 CSS 代码的前端开发人员，但也可以用于编程语言。

基本语法

只要你熟悉css的选择器知识，Emmet语法很容易上手。

---

HTML标签语法

CSS常用写法

缩小有很多，但不是都必须记住的，很多其实没有必要特意去记，使用Emmet语法是为了加快我们前端代码编写的效率。掌握基本的 *，>,+，div.class,ul>li * 5 等十分常用的，清楚这些就够用了。