html对话框带有输入_Web前端开发-减少重复输入之Emmet插件入门干货01

(1)什么是Emmet

Emmet前身是Zen Coding，是一款为了提高书写HTML和CSS代码速度而产生的插件。VS Code当前已经集成了该插件，不需要再单独安装。

(2)Emmet语法

1)快速生成HTML结构

a)输入html:5 或!：用于快速生成HTML5文档框架

b)输入标签名称：用于快速生成开始标签和结束标签

c)输入标签名称*n：用于快速生成n个相同的标签

d)输入标签>标签：用于快速生成父子级别的标签

e)输入标签+标签：用于快速生成兄弟级别的标签

f)输入标签.名称a：用于快速生成带有class属性，属性值为名称a的标签

g)输入标签#名称b：用于快速生成带有id属性，属性值为名称b的标签

h)输入标签.名称a$*5：用于快速生成5个带有class属性，属性值为名称a1、名称a2、名称a3、名称a4、名称a5的标签；

$实现数字自增长

i)输入标签{内容a}：用于快速生成带有内容a的标签

2)快速生成CSS样式

a)输入w200：用于快速生成width:200px的样式

b)输入h200：用于快速生成height:200px的样式

c)输入ti2em：用于快速生成text-indent:2em的样式

d)输入lh26：用于快速生成line-height:26的样式

e)输入m10p：用于快速生成margin:10%的样式

数字后面不带字符表示px，其他p 表示%、e 表示 em、x 表示 ex

以上语法，可以自由组合，进行复合写法。

#学问分亨官##闪光时刻二期##闪光时刻第二期主题征文#