emmet的使用

这是官方文档

https://docs.emmet.io/cheat-sheet/

记几个常用的吧。

一、>,+,^

        > 下级关系 。例子：nav>ul>li  =>table补全   =>显示

nav>ul>li
<nav>
    <ul>
        <li></li>
    </ul>
</nav>

二、项目编号  $(重要）

这个用处很大呀，列表的时候实在不要太好用，仔细理解下面这个例子

h$[title=item$]{Header $}*3
<h1 title="item1">Header 1</h1>
<h2 title="item2">Header 2</h2>
<h3 title="item3">Header 3</h3>

三、[],(),{}

这几对括号也很有意思

1.[]是属性的意思

[a='value1' b="value2"]
<div a="value1" b="value2"></div>

2.（）是类似我们四则运算中的括号，会吧括号内的看成一个整体

div>(header>ul>li*2>a)+footer>p
<div>
    <header>
        <ul>
            <li><a href=""></a></li>
            <li><a href=""></a></li>
        </ul>
    </header>
    <footer>
        <p></p>
    </footer>
</div>

3.{}

用来加文本的，看例子好懂

p>{Click }+a{here}+{ to continue}
<p>Click <a href="">here</a> to continue</p>

其他的就不列了，要多看看官方文档嘛