如何爲定製的html樣板配置Emmet的Emmet縮寫？

我正在使用Emmet和Sublime Text 2，並試圖以特定方式自定義doc的縮寫。這裏是Emmet's documentation。如何爲定製的html樣板配置Emmet的Emmet縮寫？

Emmet的doc可以通過在從頭開始新的html5頁面時擴展!字符來啓動。以下是埃米特的默認輸出擴展!字符時：

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

</body> 
</html>

我想配置doc所以，它的輸出是：

<!DOCTYPE html> 
<html lang="en"> 

<meta charset="UTF-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<title>Document</title> 
<link rel="stylesheet" href="css/style.css"> 

<header> 

</header> 

<footer> 

</footer> 

<script src="js/"></script>

我snippets.json文件試圖像這樣所需的輸出：

{ 
    "html": { 
     "abbreviations": { 
      "doc": "(html+meta[charset=UTF-8]+title{${1:Document}}+meta:vp+link:css)>header+footer+script:src" 
     }//abbreviations 
    }//html 
}//root

但輸出很糟糕，像這樣：

個

<!doctype html> 
<html lang="en"></html> 
<meta charset="UTF-8" lang="en"> 
<title lang="en">Document</title> 
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" lang="en"> 
<link rel="stylesheet" href="style.css" lang="en"> 
<header lang="en"></header> 
<footer lang="en"></footer> 
<script src="" lang="en"></script>

我的問題是：

如何完全刪除</html>？
如何清除<html>標記後的所有lang="en"屬性？
如何將默認樣式路徑更改爲css/style.css？
如何保持上面顯示的預期結果所顯示的空白空間？

來源

2013-11-15 Brian Zelip

不應刪除</html>標籤，你需要編寫正確的縮寫。事情是這樣的：html>(head>meta[charset=UTF-8]+title{${1:Document}})+body>header+footer+script[src="js/"]
見上面
覆蓋link:css縮寫或簡單地使用link[href="..."]
使用{$nl}

來源

2013-11-16 20:47:11

獲得基本的HTML5模板

確保您有埃米特包/插件安裝到您的文本編輯器中（例如Atom或Brackets）

您需要知道你的 '擴展縮寫' 鍵（S）是：

在凌：TAB
括號
：命令+ Alt + Enter鍵（Mac）或按Ctrl + Alt + Enter鍵（贏& Linux）

1）確保您的文本編輯器設置爲HTML。編輯中說HBS鬍子將無法正常工作，所以你不妨使用一個暫存器HTML文件來創建第一

2）第一類型的模板!然後「擴展縮寫」鍵（一個或多個）

3）如果不創建視口

插入「viewport'with 元：VP然後 '展開縮寫' 鍵（一個或多個）
刪除「用戶擴展性=無」和最小規模最大規模的樣子Googles<meta name=viewport content="width=device-width, initial-scale=1">

4）要插入的風格等各個環節與鏈接：CSS然後「擴展縮寫」鍵（S ）

它有點'簡單西蒙'，但它適用於我。

注意：您可以隨時更改您那麼「展開縮寫」偏好鍵（一個或多個）設置在埃米特插件

來源

2015-10-09 10:03:34 Tomdom

命令'html：5'在Emmet中有一個別名'！'。如果您只需輸入感嘆號並將其展開，就會得到與'html：5'相同的模板。 – ThisClark

謝謝，我編輯了我的筆記 – Tomdom

我沒有測試它，但你試過前面添加轉義代碼段，如選項卡\t來修復輸出的格式？

來源

2015-11-10 15:55:09 knice

Hi @ knice。最近我一直在做的是對我想要的模板進行硬編碼，而不是使用Emmet的動態語法，這是我從來沒有像我想要的那樣工作的。此外，我期望的html樣板模板已從上面更改。最近我一直在使用的是這樣的： https://gist.github.com/brianzelip/af721d3c5e9a03ff417b –

如何爲定製的html樣板配置Emmet的Emmet縮寫？

回答

相關問題