Emmet语法 —— 快速生成HTML结构

快速生成HTML结构语法

1、生成单个标签 : 标签名+tab，比如 div 然后tab 键， 就可以生成 <div></div>

2、生成多个相同标签

div*3 + tab

3、如果有父子级关系的标签，可以用 >

<!--ul>li-->
<ul>
    <li></li>
</ul>
<!--ul>li*3-->
<ul>
    <li></li>
    <li></li>
    <li></li>
</ul>

4、如果有兄弟关系的标签，用 + 就可以了

<!--span+p-->
<span></span>
<p></p>

5、如果生成带有类名或者id名字的标签，用.或#

<!-- div.box1 -->
<div class="box1"></div>

<!-- span#box2 -->
<span id="box2"></span>

6、如果生成的标签类名是有顺序的， 可以用 自增符号 $

<!-- div.box$*5 -->
<div class="box1"></div>
<div class="box2"></div>
<div class="box3"></div>
<div class="box4"></div>
<div class="box5"></div>

7、如果想要生成带内容的标签可以用 {}表示

<!--span{学海无涯}-->
<span>学海无涯</span>