Emmet语法
1、Emmet语法的前身是Zen coding，它使用缩写，来提高html/css的编写速度，Vscode内部已经集成该语法。
例题:
<body>
<!-- div+tab键=自动生成标签 -->
<div></div>
<!-- div*3+tab键=自动生成3个标签 -->
<!-- div*3 -->
<div></div>
<div></div>
<div></div>
<!-- ul>li+tab键=自动生成一个无序列表 -->
<!-- ul>li -->
<ul>
<li></li>
</ul>
<!-- div+p+tab键=自动生成一个div标签和一个p标签 -->
<!-- div+p -->
<div></div>
<p></p>
<!-- 标签名+.+属性值+tab键=自动生成一个标签中自带一个类以及有属性值 -->
<!-- div.dsd -->
<div class="dsd"></div>
<!-- 标签名+#+属性值+tab键=自动生成一个标签中自带一个id以及有属性值 -->
<!-- p#jj -->
<p id="jj"></p>
<!-- 实现生成的类名是有顺序的 -->
<!-- span.jf$*5 -->
<span class="jf1"></span>
<span class="jf2"></span>
<span class="jf3"></span>
<span class="jf4"></span>
<span class="jf5"></span>
<!-- 我们想生成的标签里面默认显示几个文字 标签+{} 在大括号里面写内容就可以了 -->
<!-- div{这是一个大盒子标签} -->
<div>这是一个大盒子标签</div>
<!-- div{我是你爸爸}*6 -->
<div>我是你爸爸</div>
<div>我是你爸爸</div>
<div>我是你爸爸</div>
<div>我是你爸爸</div>
<div>我是你爸爸</div>
<div>我是你爸爸</div>
<!-- div{$}*5 $是一个自增符号 从一开始-->
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
</body>
扫一扫
179
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
