Emmet是Visual Studio Code中的整合工具，可以幫助我們更快地編寫HTML和CSS程式碼。它允許我們將簡單的縮寫擴展為完整的程式碼區塊，從而節省時間並減少重複輸入。 ⏱️
Emmet 的主要特點🛠️
-
縮寫擴充：將縮寫轉換為完整的程式碼。 📝
-
程式碼片段：快速插入預先定義程式碼結構的捷徑。 ⚡
-
快速導航和編輯：允許快速導航和編輯程式碼中的類似元素。 🏃♂️
縮寫的實際例子🔍
1 -建立一個具有特定類別和/或 ID 的 div
-
縮寫：
.className或#idName -
範例：鍵入
.container並按 Enter 鍵將擴充為：
<div class="container"></div>
2 -建立一個包含專案的無序列表
-
縮寫：
ul>li*3 -
範例：鍵入
ul>li*3並按 Enter 鍵將擴充為：
<ul>
<li></li>
<li></li>
<li></li>
</ul>
3 -建立帶有文字的連結
-
縮寫：
a[href="link"]{text} -
範例：輸入
a[href="https://example.com"]{Test}並按 Enter 鍵將展開為：
<a href="https://example.com">Test</a>4 -基本 HTML 結構
-
縮寫：
! -
例：打字
!然後按 Enter 鍵將展開為基本 HTML 結構。
5 -建立一個帶有文字的段落
-
縮寫：
p{text} -
範例：輸入
p{This is a paragraph}並按 Enter 鍵將展開為：
<p>This is a paragraph</p>
6 -建立具有 src 和 alt 屬性的映像
-
縮寫：
img[src="path"][alt="description"] -
範例：鍵入
img[src="image.jpg"][alt="Image description"]並按 Enter 鍵將擴展為：
<img src="image.jpg" alt="Image description">
7 -建立一個帶有輸入欄位和提交按鈕的表單
-
縮寫：
form>input[type="text" name="name"]+button[type="submit"]{Submit} -
範例：輸入
form>input[type="text" name="name"]+button[type="submit"]{Submit}並按 Enter 鍵將擴充為：
<form>
<input type="text" name="name">
<button type="submit">Submit</button>
</form>
8 -建立一個包含子元素的結構（多個元素）
-
縮寫：
.container>a+p -
範例：鍵入
.container>a+p並按 Enter 鍵將擴展為：
<div class="container">
<a href=""></a>
<p></p>
</div>
這些只是您可以在 VSCode 中使用 Emmet 執行的操作的幾個範例。這些快捷方式提供的效率可以顯著改變您的日常生活。 💡
願力量與大家同在。再見
1) --- 會變成分隔線（上一行必須是空白）
2) # 會變成一級標題
3) ## 會變成二級標題
4) ### 會變成三級標題
5) **粗體文字**會顯示粗體文字
6) ```當第一行與最後一行會顯示程式碼
7) 請搜尋 Markdown 語法，了解各種格式