emmet语法的使用方法

快速生成HTML结构标签：<kbd>!</kbd>+<kbd>Tab</kbd>或html:h5+<kbd>Tab</kbd>
快速生成DIV标签：div+<kbd>Tab</kbd>
快速生成带class属性DIV标签：.ID+<kbd>Tab</kbd>
```
<div class="id"></div>
```
生成DIV标签中有id属性：#test+<kbd>Tab</kbd>
```
<div id="test"></div>
```
DIV标签带clsaa元素、id属性、文字内容：.test#name{名称}+<kbd>Tab</kbd>
```
<div class="test" id="name">名称</div>
```
父子关系emmet方法：div>li+<kbd>Tab</kbd>
```
<div>
 <li></li>
</div>
```
兄弟关系：div+li+<kbd>Tab</kbd>
```
<div></div>
<li></li>
```

快速创建a标签带文字内容并从0开始：ul.menu>li.name*5>a{名称$@0}+<kbd>Tab</kbd>

 <ul class="menu">
     <li class="name"><a href="">名称0</a></li>
     <li class="name"><a href="">名称1</a></li>
     <li class="name"><a href="">名称2</a></li>
     <li class="name"><a href="">名称3</a></li>
     <li class="name"><a href="">名称4</a></li>
 </ul>

快速创建a标签带文字内容并从0开始倒序：ul.menu>li.name*5>a{名称$@-0}+<kbd>Tab</kbd>

 <ul class="menu">
     <li class="name"><a href="">名称4</a></li>
     <li class="name"><a href="">名称3</a></li>
     <li class="name"><a href="">名称2</a></li>
     <li class="name"><a href="">名称1</a></li>
     <li class="name"><a href="">名称0</a></li>
 </ul>

快速创建a标签带文字内容并从5-9：ul.menu>li.name*5>a{名称$@5}+<kbd>Tab</kbd>

<ul class="menu">
    <li class="name"><a href="">名称5</a></li>
    <li class="name"><a href="">名称6</a></li>
    <li class="name"><a href="">名称7</a></li>
    <li class="name"><a href="">名称8</a></li>
    <li class="name"><a href="">名称9</a></li>
</ul>

5行8列的表格创建：table>caption{名称}+(thead>tr>th{user}*8)+(tbody>tr*5>td{name}*8)+<kbd>Tab</kbd>

<table>
<caption>名称</caption>
<thead>
    <tr>
        <th>user</th>
        <th>user</th>
        <th>user</th>
        <th>user</th>
        <th>user</th>
        <th>user</th>
        <th>user</th>
        <th>user</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
    </tr>
    <tr>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
    </tr>
    <tr>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
    </tr>
    <tr>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
    </tr>
    <tr>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
        <td>name</td>
    </tr>
</tbody>
</table>

emmet语法，快速生成使用方法

emmet语法的使用方法