Emmet外掛程式使用

2021-08-21 10:13:10 字數 1662 閱讀 2105

一、生成html5的文件的emmet語法：

1、語法一：html5+tab鍵
2、語法二：html:5+tab鍵
3、語法三：！+tab鍵
二、用在html文件中的head中的emmet語法：

1、規定html文件的字符集編碼：meta:utf+tab鍵

2、建立當前的html的視窗：meta:vp+tab鍵

3、相容ie8：meta:compat+tab鍵

4、引用css檔案：link+tab鍵 或 link:css+tab鍵（後者會自動載入css檔案）

5、引用指令碼：script+tab鍵 或 script:src+tab鍵（後者會自動將src屬性新增上）

三、用在html文件中的body中的emmet語法：

1、生成帶類樣式的標籤：

例如：div.div1+tab鍵（ .是css樣式中的類 ）
2、生成帶id的標籤：

例如：div#div1+tab鍵盤（ #是css樣式中的id ）
3、生成a標籤：

（1）a+tab鍵

（2）生成完整的url字首：a:link+tab鍵 （如果是郵箱位址則是 a:mail+tab鍵）

4、根據標籤的位置關係來生成標籤：

（1）生成同級標籤，即兄弟標籤：div.div1+div.div2+tab鍵
（2）生成當前標籤的後代標籤，即下級標籤：ul>li+li+li+tab鍵

（3）生成當前標籤的父級標籤，即上級標籤：h3>span^div.div1+tab鍵
5、在建立標籤的時候同時建立標籤內部的文字：

div+tab鍵

hello world!
6、在建立標籤的時候同時建立標籤自定義的屬性：a[href=""]+tab鍵

7、重複生成標籤：ul>li*5+tab鍵

8、給標籤自動新增編號或排序：

（1）ul.list>li.item*5>a （$是乙個佔位符）

（2）ul.list>li.item*5>a

（3）ul.list>li.item*5>a (降序）

（4）ul.list>li.item*5>a (按指定的序號排序）

Emmet外掛程式的使用

或者html 5快速生成h5。p.p1 p1生成class與id a href www.baidu.com 生成結果 是新增內容是設定屬性 我是a標籤 div div div div span，生成結果 分組，用 將命令分組 我試了很多次，我的編譯器不識別分組語法，所以我就把語法放上去，自己嘗試吧 ...

Emmet外掛程式快捷使用

emmet 在html檔案中，關於emmet使用 1 補全文件結構 2 標籤 3 生成下級元素 父元素 子元素 例如 ul li 生成 3 生成兄弟元素 元素1 元素2 例如 p div 生成 3 生成上級元素 父元素 子元素 兄弟元素 例如 ul li div 生成 解析 div元素跳出li元素與...

Sublime外掛程式Emmet安裝與使用

開啟sublimetext3，ctrl 貼上下面 import urllib.request,os pf package control.sublime package ipp sublime.installed packages path urllib.request.install opener...