是不是你已經(jīng)厭煩了輸入減括號等html語法健无,給你推薦一個速錄的插件苛让,這個插件支持的編輯器非常廣泛,語法很簡單
輸入縮寫春锋,按tab即可生成相應(yīng)代碼矫膨。
嵌套操作
>: Child
+: Sibling
^: Climb-up
*: 乘法, 如 ul<li*5,將生成如下結(jié)果
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
(): 分組期奔,如 (header>ul>li*2)+footer>p侧馅,結(jié)果如下
<header>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</header>
<footer>
<p></p>
</footer>
屬性操作
ID和Class,如div#header.class1.class2.class3, 結(jié)果如下:
<div id="footer" class="class1 class2 class3"></div>
也可以自定義屬性能庆,如td[title="hello" colspan=3]施禾,屬性可以不用引號,結(jié)果如下:
<td title="Hello world!" colspan="3"></td>
序列
結(jié)合之前的嵌套操作和屬性操作, 通過和$可以輸出數(shù)字序列, 如ul>li.item$3搁胆,結(jié)果如下:
<ul>
<li class="item1"></li>
<li class="item2"></li>
<li class="item3"></li>
</ul>
通過@, 可以改變數(shù)字序列的順序以及基數(shù)弥搞,如ul>li$@2-*3
<ul>
<li class="item4"></li>
<li class="item3"></li>
<li class="item2"></li>
</ul>
文字
{}: 通過大括號(curly braces)在元素中插入文字, 如a{Click me}:
<a href="">Click me</a>
注意 a{click}+b{here} 和 a>{click}+b{here} 的區(qū)別:
<!-- a{click}+b{here} -->
<a href="">click</a><b>here</b>
<!-- a>{click}+b{here} -->
<a href="">click<b>here</b></a>