emment的八种用法
1.标签与内容快速生成
标签{内容} + Tab键快速生成
例如:
<!--h3{这是一个h3标签}--><h3>这是一个h3标签</h3><!--执行后如上所示-->
2.属性和语法糖
[属性]{内容} + Tab键快速生成
例如:
<!--[id=app]{这是一个定义了id属性的标签}]--><div id="app">这是一个定义了id属性的标签</div><!--执行后如上所示--><!--[class=app]{这是一个定义了class属性的标签}]--><div class="app">这是一个定义了class属性的标签</div><!--执行后如上所示-->
语法糖用法
由于id,class为通用属性,可以用语法躺的格式去书写例如:
<!-- #app{这是一个定义了id属性的标签} --><div id="app">这是一个定义了id属性的标签</div><!--执行后如上所示--><!-- .app{这是一个定义了class属性的标签} --><div class="app">这是一个定义了class属性的标签</div><!--执行后如上所示-->3.重复生成标签
使用*进行重复标签生成
标签{内容}*数量
例如:
<!--div{div标签内容}*3--><div>div标签内容</div><div>div标签内容</div><div>div标签内容</div><!--执行后如上所示-->
4.父子标签生成
使用>进行父子标签生成
父标签{内容}>字标签{内容} + Tab键快速生成
例如:
<!-- div{Div内容}>p{p标签内容}>span{span标签内容} --><div>Div内容<p>p标签内容<span>span标签内容</span></p></div><!--执行后如上所示-->
5.兄弟标签生成
使用+进行兄弟标签生成
标签{内容}+标签{内容} + Tab键快速生成
<!--div{div标签内容}+p{p标签内容}--><div>div标签内容</div><p>p标签内容</p><!--执行后如上所示-->
6.父级生成
使用^进行父级生成
标签>标签{内容}^标签{内容} + Tab键快速生成
例如:
<!-- # (.list>p{这是个p标签}^span{这是个span标签} --><div class="list"><p>这是个p标签</p></div><span>这是个span标签</span><!--执行后如上所示-->
7.分组生成
使用(...)进行分组生成
标签>标签+(标签>标签) + Tab键快速生成
例如:
<!--.list>h3{导航}+(ul>li*3>a{link})--><div class="list"><h3>导航</h3><ul><li><a href="">link</a></li><li><a href="">link</a></li><li><a href="">link</a></li></ul></div><!--执行后如上所示-->
8.序号
正序从0开始
使用$默认从0排序
标签{内容$} + Tab键快速生成
例如:
<!--ul>li{列表$}*3--><ul><li>列表1</li><li>列表2</li><li>列表3</li></ul><!--执行后如上所示-->
正序从指定数字开始
使用$@从指定数字开始排序排序
@来定义从那个数排序
标签{内容$@} + Tab键快速生成
例如:
<!--ul>li{列表$@8}*3--><ul><li>列表8</li><li>列表9</li><li>列表10</li></ul><!--执行后如上所示-->
倒叙进行排序
使用$@-开始倒叙排序
标签{内容$@-} + Tab键快速生成
例如:
<!--ul>li{列表$@-}*3--><ul><li>列表3</li><li>列表2</li><li>列表1</li></ul><!--执行后如上所示-->
倒叙从指定数字倒叙排序
使用$@-8开始倒叙排序
标签{内容$@-8} + Tab键快速生成
例如:从8开始倒叙
<!--ul>li{列表$@-8}*3--><ul><li>列表10</li><li>列表9</li><li>列表8</li></ul><!--执行后如上所示-->
