###tab 补全所有标签 ###元素
11.在编辑器中输入元素名称,即可自动补全生成 HTML 标签,即使不是标准的 HTML 标签。 22.输入:! 或者 html:5 或者 html:4s 或者 html:4t 将自动补全html基本结构
###嵌套操作
11.使用“>”生成子元素 2// 输入 3div>ul>li 4// 按下TAB键 5<div> 6 <ul> 7 <li></li> 8 </ul> 9</div> 10 112.使用“+”生成兄弟元素 12// 输入 13div+p+bq 14// 按下TAB键 15<div></div> 16<p></p> 17<blockquote></blockquote> 18 193.使用“^”生成父元素 20// 输入 21div+div>p>span+em^bq 22// 按下TAB键 23<div></div> 24<div> 25 <p><span></span><em></em></p> 26 <blockquote></blockquote> 27</div> 28 294.使用“*”生成多个相同元素 30// 输入 31div>ul>li*5 32// 按下TAB键 33<div> 34 <ul> 35 <li></li> 36 <li></li> 37 <li></li> 38 <li></li> 39 <li></li> 40 </ul> 41</div> 42 435.使用“()”将元素分组 44// 输入 45// "+" 后面的元素与括号中的第一个元素属于兄弟关系 46div>(header>ul>li*2)+footer>p 47//按下TAB键 48<div> 49 <header> 50 <ul> 51 <li></li> 52 <li></li> 53 </ul> 54 </header> 55 <footer> 56 <p></p> 57 </footer> 58</div> 59
###属性操作
11.id与class:元素与 id 属性值之间用 “#” 分隔,与 class 属性值之间用 “.” 分隔 2// 输入 3div#header+div.page+div#footer.class1.class2.class3 4// 按下TAB键 5<div id="header"></div> 6<div class="page"></div> 7<div id="footer" class="class1 class2 class3"></div> 8 92.使用“[]”标记其他属性 10// 输入 11td[title='hello' colspan=3] 12// 按下TAB键 13<td title="hello" colspan="3"></td> 14 153.用“$”符号实现1到n的自动编号(“*”实现多个元素) 16// 输入 17li.item$*3 18// 按下TAB键 19<li class="item1"></li> 20<li class="item2"></li> 21<li class="item3"></li> 22 23可在 “$” 后添加 “@n” 修改编号的起始值为n。 24// 输入 25li.item$@3*3 26// 按下TAB键 27<li class="item3"></li> 28<li class="item4"></li> 29<li class="item5"></li> 30 31可在 “$” 后添加 “@-” 修改编号的方向。 32// 输入 33li.item$@-3*3 34// 按下TAB键 35<li class="item5"></li> 36<li class="item4"></li> 37<li class="item3"></li> 38 394.用“{}”添加文本内容 40// 输入 41a[href=me.htm]{click me} 42// 按下TAB键 43<a href="me.htm">click me</a>