html 初始结构 ！+ Tab

！+ Tab
image.png
image.png

id（#）

class（.）

属性（[attr]）

a[href='www.baidu.com' name='baidu']（中括号内填写属性键值对的形式，并且空格隔开）

  1. <a href="www.baidu.com" name="baidu"></a>

子节点（>）

兄弟节点（+）

上级节点（^）

div>ul>li^div (这里的^是接在li后面所以在li的上一级，与ul成了兄弟关系,当然两个^^就是上上级）

  1. <div>
  2.    <ul>
  3.      <li></li>
  4.    </ul>
  5.    <div></div>
  6.  </div>

重复（*）

ul>li*5（*号后面添加数字表示重复的元素个数）

  1. <ul>
  2.     <li></li>
  3.     <li></li>
  4.     <li></li>
  5.     <li></li>
  6.     <li></li>
  7. </ul>

分组（()）

div>(ul>li>a)+div>p（括号里面的内容为一个代码块，表示与括号内部嵌套和外面的的层级无关）

  1. <div>
  2.     <ul>
  3.         <li><a href=""></a></li>
  4.     </ul>
  5.     <div>
  6.         <p></p>
  7.     </div>
  8. </div>

编号 （$）

ul>li.test$*3 （$代表一位数，后面更上*数字就代表从1递增到填写的数字）

  1.  <ul>
  2.    <li class="test1"></li>
  3.    <li class="test2"></li>
  4.    <li class="test3"></li>
  5.  </ul>

文本（{}）

ul>li.test$*3{测试$} （{里面填写内容，可以和$一起组合使用哦}）

  1. <ul>
  2.   <li class="test1">测试1</li>
  3.   <li class="test2">测试2</li>
  4.   <li class="test3">测试3</li>
  5. </ul>

隐式（默认）标签

部分标签可以不使用输入标签，直接输入指令，即可识别父类标签。

默认div 例如：.test

  1. <div class="test"></div>

li： 可在ul 和 ol 中使用 例如：ul>.test$*3

  1. <ul>
  2.    <li class="test1"></li>
  3.    <li class="test2"></li>
  4.    <li class="test3"></li>
  5.  </ul>

option：可在select中使用例如：select>.test$*5

  1. <select name="" id="">
  2.   <option class="test1"></option>
  3.   <option class="test2"></option>
  4.   <option class="test3"></option>
  5.   <option class="test4"></option>
  6.   <option class="test5"></option>
  7. </select>

tr：可在 table、tbody、thead 和 tfoot 中使用
td：可在 tr 中使用