Emmet，寫HTML簡單又快速

用Emmet這個套件，可以用標籤與快速鍵，建立一個完整的HTML。可以有效率的寫程式。

在VS Code、Sublime Text 還有線上網站 codepen 、JS Bin、JS Fiddle 都可以使用。

1. >：建立裡面的子層。

例：ul>li>p

📷

2. +：建立連著的兄弟層。

例：div+h1+h2

📷

3. *：建立重複的標籤。

例：ul>li*3

📷

4. ^：建立與上一層連著的兄弟層。

例1：div+div>p>span+em^bq

📷

例2：div+div>p>span+em^^bq

📷

5. {}：標籤內的文字。

例：ul>li*3{清單}

📷

6. []：輸入屬性。

例：a[href=”#”]

📷

7. .：建立class命名；#：建立id命名。

例1：.box

📷

例2：#name

📷

8. $：建立編號。

例1：ul>li*3{編號：$}

📷

例2：h$[title=item$]*2

📷

例3：ul>li.item$$$*2

📷

9. $@-：編號降冪。

例1：ul>li*3{編號：$@-}

📷

例2：ul>li.item$@3*3

📷

10. ()：grouping。

例1：div>(header>ul>li*2>a)+footer>p

📷

例2：(div>dl>(dt+dd)*3)+footer>p

📷