1份殿、簡(jiǎn)介
Emmet語(yǔ)法的前身是Zen coding,它使用縮寫(xiě),來(lái)提高h(yuǎn)tml/css的編寫(xiě)速度, Vscode內(nèi)部已經(jīng)集成該語(yǔ)法卿嘲。
2、快速生成HTML結(jié)構(gòu)語(yǔ)法
- 生成標(biāo)簽 直接輸入標(biāo)簽名 按tab鍵即可拾枣。比如 div 然后tab 鍵盒让， 就可以生成
<div></div> - 如果想要生成多個(gè)相同標(biāo)簽 加上 * 就可以了。比如 div*3 就可以快速生成3個(gè)div
- 如果有父子級(jí)關(guān)系的標(biāo)簽姨蝴，可以用 >。比如 ul > li就可以了
- 如果有兄弟關(guān)系的標(biāo)簽左医，用 + 就可以了同木。比如 div+p
- 如果生成帶有類(lèi)名或者id名字的，直接寫(xiě) .demo 或者 #two tab 鍵就可以了
- 如果生成的div 類(lèi)名是有順序的秕硝，可以用自增符號(hào) $
- 如果想要在生成的標(biāo)簽內(nèi)部寫(xiě)內(nèi)容可以用 { } 表示
3斩萌、快速生成CSS樣式語(yǔ)法
CSS 基本采取簡(jiǎn)寫(xiě)形式即可
- 比如 w200 按tab 可以 生成
width: 200px; - 比如 lh26px 按tab 可以生成
line-height: 26px;
4、快速格式化代碼
Vscode 快速格式化代碼: shift+alt+f
也可以設(shè)置當(dāng)我們保存頁(yè)面的時(shí)候自動(dòng)格式化代碼:
1）文件 ------.>【首選項(xiàng)】---------->【設(shè)置】憋飞；
2）搜索emmet.include;
3）在settings.json下的【工作區(qū)設(shè)置】中添加以下語(yǔ)句：
"editor.formatOnType": true,
"editor.formatOnSave": true
