sublime插件Emmet使用笔记！

官方文档： https://docs.emmet.io/cheat-sheet/

ctr+shift+p或者直接点击菜单按钮进入package control

image.png

输入install package后等待一会，在弹出的界面输入要安装的包

image.png

image.png

image.png

输入Emmet点击出现的插件，下方状态栏会显示安装状态，安装完成会显示说明文档，文档里有教程怎么使用。

image.png

新建html文件，输入！按tab键

image.png

输入header>nav>ul>li*5>a:link['target'='_blank']{菜单 #$} 按tab键

image.png

header>div#div>ul.class1.class2>li.class_li#id_$*5>a:link[target='_blank' title="title #$" alt="alt #$"]>button[id="button_$" tag="tag_$"]{菜单 #$}

        

            

                
菜单 #1
                
菜单 #2
                
菜单 #3
                
菜单 #4
                
菜单 #5
            
        
    
   

#content>.article>p.p1[title="p1" alt="p1" style="color:red;font-size:20px"]+p.p2[title='p2'][alt='p2'][style='color:green;font-size:30px']

table>(thead>td.col$*4)+(tbody>tr.row$*3>td.col$)+(tfoot>td*5)
注意+的使用要用（）把thead、tbody、tfoot当做一个整体

html>(head>title+style[type='text/css']+(script[src="abc$.js" type="text/javascript"]*3))+(body>(div.content>div.nav>ul>li>a>span)+(div.sidebar>div.top+div.middle+div.bottom)+(div.mian>div.article*3>h1{article$}))+div.footer{copyright}

    
    
    
    
    


    

        

            

                

            
        
    
    

        

        

        

    
    

        

            
article1
        
        

            
article2
        
        

            
article3
        
    

copyright
                     

不指定元素默认div，例如.classname、#idname，id和class属性名不能为关键词

ul>li*10>{$}       正序从1到10
ul>li*10>{$@5}     正序从5开始到14
ul>li*10>{$@-}     倒序从10到1
ul>li*10>{$@-5}    倒序10条，最小为5，就是从14开始到5 

a
a:link

link

script
script:src

input     
inp    
input:p    input:password    
btn  button    
btn:s  button:s  button:submit  
btn:r  button:r  button:reset