欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

初学 emmet 生成标签

程序员文章站 2022-05-10 17:26:26
...

emmet

快速生成 div 标签

  • div.box 按 Tab 键
  • .boc
    -div#active
  1. <div class="box"></div>

文本标签

  • P{文本内容}
  1. <p>文本内容</p>

多层标签 > 为下级标签

  • .box>p>a
  1. <div class="box">
  2. <p><a href=""></a></p>
  3. </div>

平层标签 + 为平级标签

  • .box+p+.active
  1. <div class="box"></div>
  2. <p></p>
  3. <div class="active"></div>

父级标签 ^

  • .box>.active>p>a^^.shop
  1. <div class="box">
  2. <div class="active">
  3. <p><a href=""></a></p>
  4. </div>
  5. <div class="shop"></div>
  6. </div>
  • .box>.active>p>a^.shop
  1. <div class="box">
  2. <div class="active">
  3. <p><a href=""></a></p>
  4. <div class="shop"></div>
  5. </div>
  6. </div>

重复标签 * n(数量)

ul.box>li.active*6

  1. <ul class="box">
  2. <li class="active"></li>
  3. <li class="active"></li>
  4. <li class="active"></li>
  5. <li class="active"></li>
  6. <li class="active"></li>
  7. <li class="active"></li>
  8. </ul>