VsCode自带Emmet基础用法（基本够用了）

很早前的一篇文章了，内容比较简单，不过基本够用了，太复杂的东西与其花很多时间学习，不如敲代码呢！

1. 新建html文件，保存之后，输入“！”，按Tap(或Enter）键，自动生成HTML结构

2. 标签只要直接输入标签名（不要输入<>），按Tap(或Enter）键自动生成完整的标签

3. 输入标签和id:标签名#id名

   输入“span#sp",Tap(或Enter）键，

   =>

   <span id="sp"></span>
   

4. 输入标签和class值:标签名.class 名

   输入"span.Sp",Tap(或Enter）键

   =>

   <span class="Sp"></span>
   

5. 【其中】：元素绑定多个类名:标签名.class名1.class名2。。。

   输入"span.Sp1.Sp2",Tap键（或Enter）键

   =>

   <span class="Sp1 Sp2"></span>
   

6. 输入标签和标签中的值:标签名｛标签内容｝

   输入“span{test}",Tap(或Enter）键，

   =>

   <span>test</span>
   

7. 同时输入多个同级标签:标签名+标签名+标签名。。。

   输入"li+li+li" , Tap(或Enter）键，

   =>

   <li></li>
   <li></li>
   <li></li>
   

8. 同时输入父级标签和子标签:父级标签名>子级标签名。。。

   输入“table>ul>li+li ",Tap(或Enter）键，

   =>

   <table>
       <ul>
           <li></li>
           <li></li>
       </ul>
   </table>
   

9. 输入子级元素的父级元素的同级元素

   输入" div>p>span^ul>li "

   【注意】“^”之后的ul标签是和span的父级标签 p 同级的

   =>

   <div>
       <p><span></span></p>
       <ul>
           <li></li>
       </ul>
   </div>
   

10. 输入超链接的链接href值

    输入“a:mail ”
    =>

    <a href="mailto:"></a>
    

    输入“a:link ”
    =>

    <a href="http://"></a>
    

11. 输入标签的某个属性值
    输入“span[style=color:red]”
    =>

    <span style="color:red"></span>
    

    输入“span[style=color:red].Sp#sp"

    =>

    <span style="color:red" class="Sp" id="sp"></span>
    

12. 同级标签输入多个使用乘法
    输入“li*3"
    =>

    <li></li>
    <li></li>
    <li></li>