使用vs code编辑器或者sublime(当然还有很多其他编辑器)都会有一个很实用功能,TAB键自动补全功能。特别简化了写前端代码的过程,大大提高了效率。

我把所有语法上传到了空间上,制作了一个单页:https://www.ihewro.com/emmet.html请右键新窗口打开)。
(来源于这个:http://docs.emmet.io/cheat-sheet/ 去掉了所有js和多余的部分。)

下面是自己的一些常用的记录(不断更新):

句法

child:>

nav>ul>li

<nav>
    <ul>
        <li></li>
    </ul>
</nav>
Sibling:+(同级标签)

div+p+bq

<div></div>
<p></p>
<blockquote></blockquote>

divpbq标签都属于同一等级

组合符号:()

(div>p>span)+bq

<div>
    <p><span></span></p>
</div>
<blockquote></blockquote>

divbq属于同一等级

表示数目:*

ul>li*5

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

5个li标签

创建元素、ID、类

head

<head>
</head>

#head

<div id="head"></div>

head

<div class="head"></div>

三者可以结合使用,非常方便。

html内容

下面一些语法可以直接补全html模板,很酷!

!
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

自动补全html5初始代码

最后修改:2019 年 03 月 23 日
喜欢我的文章吗?
别忘了点赞或赞赏,让我知道创作的路上有你陪伴。