emmet操作快捷

原文链接： http://106.14.133.86/?p=94

meta:vp //页面窗口
meta:utf //字符代码
meta:compat //兼容IE8或其他浏览器
script:src
link:css

生成带class和id的标签
p.right
div.reght .right
p#header
div#header #header
a:link //网站链接
a:mail //带邮箱的链接

根据标签的位置来生成标签
h2.header+p.info //生成同级兄弟标签

ul>li //生成后代标签
ul>li+li+li
ul>li*7

h2>span^p.info 在span的父级生成p标签
结果：
<h2><span></span></h2>
<p class="info"></p>

a{php整完了}
结果：<a href="">php整完了</a>

给标签加属性
p[title="111"]
结果：<p title="111"></p>

a[href:"http://www.baidu.com"]{你好}
结果：<a href="href:"http://www.baidu.com"">你好</a>

快速生成有八个菜单的导航
ul.list>li.item*8>a[href://www.baidu.com]{导航}
结果：
<ul class="list">
<li class="item"><a href="href://www.baidu.com">导航</a></li>
<li class="item"><a href="href://www.baidu.com">导航</a></li>
<li class="item"><a href="href://www.baidu.com">导航</a></li>
<li class="item"><a href="href://www.baidu.com">导航</a></li>
<li class="item"><a href="href://www.baidu.com">导航</a></li>
<li class="item"><a href="href://www.baidu.com">导航</a></li>
<li class="item"><a href="href://www.baidu.com">导航</a></li>
<li class="item"><a href="href://www.baidu.com">导航</a></li>
</ul>

自动生成编号
ul.list>li.item*8>a{导航$}
结果：
<ul class="list">
<li class="item"><a href="">导航1</a></li>
<li class="item"><a href="">导航2</a></li>
<li class="item"><a href="">导航3</a></li>
<li class="item"><a href="">导航4</a></li>
<li class="item"><a href="">导航5</a></li>
<li class="item"><a href="">导航6</a></li>
<li class="item"><a href="">导航7</a></li>
<li class="item"><a href="">导航8</a></li>
</ul>

ul.list>li.item*8>a{导航$$}
结果
<ul class="list">
<li class="item"><a href="">导航01</a></li>
<li class="item"><a href="">导航02</a></li>
<li class="item"><a href="">导航03</a></li>
<li class="item"><a href="">导航04</a></li>
<li class="item"><a href="">导航05</a></li>
<li class="item"><a href="">导航06</a></li>
<li class="item"><a href="">导航07</a></li>
<li class="item"><a href="">导航08</a></li>
</ul>

ul.list>li.item*8>a{导航$$@-}
结果
<ul class="list">
<li class="item"><a href="">导航08</a></li>
<li class="item"><a href="">导航07</a></li>
<li class="item"><a href="">导航06</a></li>
<li class="item"><a href="">导航05</a></li>
<li class="item"><a href="">导航04</a></li>
<li class="item"><a href="">导航03</a></li>
<li class="item"><a href="">导航02</a></li>
<li class="item"><a href="">导航01</a></li>
</ul>

ul.list>li.item*8>a{导航$$$@100}
结果
<ul class="list">
<li class="item"><a href="">导航100</a></li>
<li class="item"><a href="">导航101</a></li>
<li class="item"><a href="">导航102</a></li>
<li class="item"><a href="">导航103</a></li>
<li class="item"><a href="">导航104</a></li>
<li class="item"><a href="">导航105</a></li>
<li class="item"><a href="">导航106</a></li>
<li class="item"><a href="">导航107</a></li>
</ul>

常用的基本就是这个了；详细请查看emmet官网