HTML快速生成代码的语法(Emmet)

所有的操作都是按下tab键即可瞬间完成。

1.属性操作

用.来生成，后面就是类名

div.aaa

按tab后结果如下：

<div class="aaa"></div>

同样的是,id话用#来代替.

div#aaa

按tab

<div id="aaa"></div>

其他属性用[]

div[title='hello' colspan=3]

结果

<div title="hello" colspan="3"></div>

用$来实现编号,实际上就是个占位符

li.aaa$*3

结果

<li class="aaa1"></li>
<li class="aaa2"></li>
<li class="aaa3"></li>

用@n来修改起始值

li.aaa$@3*3

结果，3可以用-3这样就会变成-5，-4，-3

<li class="aaa3"></li>
<li class="aaa4"></li>
<li class="aaa5"></li>

{}可以添加文本，不过这个不实用

2.嵌套使用

>生成子元素

div>ul>li

结果

<div>
     <ul>
         <li></li>
     </ul>
</div>

其他的有，+生成兄弟元素，“^”生成父元素，”*n“生成多个相同元素，”()”将元素分组