1.VSCODE安装

vscode安装

2.emmet语法

标签属性:(.) ,(id)

语法:标签 + . + 类选择器名
例子：
输入：div.obj1
结果：<div class="obj1"></div>

语法:标签 + . + ID选择器名
例子：
输入：div#obj1
结果：<div id="obj1"></div>

上下级标签嵌套

语法：标签>标签>标签
例子：
输入：div>p>ul>li
结果：

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

平级标签

语法：标签+标签+标签
例子：
输入：div+p+ul+li
结果：

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

标签上级的平级

语法：标签>标签^标签
例子：
输入：div>p^a
结果：

    <div>
        <p>
        </p>
    </div>
    <a></a>

文本内容

语法：标签{需要输入的内容}
例子：
输入：p{asd}
输出：<p>asd</p>

重复代码次数

语法：*n
例子:
输入:div>p>a{link}*5
输出：


    <div>
        <p>
            <a href="">link</a>
            <a href="">link</a>
            <a href="">link</a>
            <a href="">link</a>
            <a href="">link</a>
        </p>
    </div>

标签属性[]

语法：标签[属性]
例子：
输入：a[href=”https://www.php.cn"]{php}
输出：<a href="https://www.php.cn">php</a>

序号：$（输出内容加编号）

语法：用于{}中:{内容$}
例子：
输入：ul>li{php$}*2
输出：


    <ul>
        <li>php1</li>
        <li>php2</li>
    </ul>

序号:$$（个位数编号前面加0）

语法：用于{ }中:{内容}
例子：
输入：ul>li{php}*2
输出：


    <ul>
        <li>php01</li>
        <li>php02</li>
    </ul>

序号：$@n (从n开始编号)

语法：用于{ }中:{内容$@n}
例子：
输入：ul>li{php$@5}*4
输出：


    <ul>
        <li>php5</li>
        <li>php6</li>
        <li>php7</li>
        <li>php8</li>
    </ul>

序号：$@-n (降序编号到n)

语法：用于{ }中:{内容$@-n}
例子：
输入：ul>li{php$@-5}*4
输出：


    <ul>
        <li>php8</li>
        <li>php7</li>
        <li>php6</li>
        <li>php5</li>
    </ul>

VSCODE安装与emmet语法