emmet快速缩写展开的基本写法与心得

2024年2月12日 116次阅读 来源: 前端小渣渣啊啊啊啊

emmet的基本写法：

  • .ct 点是class

   <div class="ct"></div>

  • ＃ct 井号是id

    <div id="ct"></div>

  • .ct>.ct 加号表示两个div并列

   <div class="ct"></div>
   <div class="ct"></div>

  • .ct>ct1 “>”表示其子元素

   <div class="ct">
       <div class="ct1"></div>
   </div>

  • .ct*6 乘号后面加个数表示该元素的展开个数

   <div class="ct"></div>
   <div class="ct"></div>
   <div class="ct"></div>
   <div class="ct"></div>
   <div class="ct"></div>
   <div class="ct"></div>

  • .ct$*6 $符号表示数字标号

    <div class="ct1"></div>
    <div class="ct2"></div>
    <div class="ct3"></div>
    <div class="ct4"></div>
    <div class="ct5"></div>
    <div class="ct6"></div>

以上的基本方法排列组合，再用（）来决定展开顺序即可；

心得

一直以来emmet使得html标签和css标签的书写速度加快，减少了许多不必要浪费的时间，学会使用emmet是每一个前端开发人员应该具有的基本技能。

    原文作者：前端小渣渣啊啊啊啊
    原文地址: https://segmentfault.com/a/1190000015238485
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞