2022-12-03 2169
Emmet语法的前身是Zen coding,它使用缩写来提高html/css的编写速度,vscode内部已经集成该语法
1. 快速生成Html结构
生成标签,直接输入标签名,按tab键即可,比如div然后按tab键,就可以生成
如果想要生成多个相同标签,加上*就可以了,比如div*3可以快速生成三个div
如果有父子级关系的标签,可以用>,比如ul > li
如果有兄弟关系的标签,用+,比如div+p
如果生成带有类名或者id名的,直接写.demo或者#two,再按tab键即可,例如div.banner
如果生成的div类名是有顺序的,可以使用自增符号$,例如div.demo$*5
如果想要在生成的标签内部写内容可以用{}biaoshi
2. 快速生成CSS样式
CSS取每个单词得首字母简写即可:
比如,ti2em,按tab,可以生成text-indent: 2em;
比如,w200,按tab,可以生成width: 200px;