標記或標記，指的是標記或標籤語言本身 HTML和CSS，我們都知道為了創建網頁模板而一一打開和關閉標籤是多麼痛苦......
當然有一些解決方案，其中之一是使用 IDE 自動完成，例如 Dreamweaver中 mierda 藍獅 如果你不買插件會很煩人 o 科莫多島 非常重…關鍵是 IDE 或代碼編輯器選項過多，通常最終會以難以想像的方式阻礙工作； 情況就是如此 Dreamweaver中 它會用圖形方式生成的垃圾代碼填滿你的代碼，而且笨重、昂貴且醜陋。 藍獅 這很煩人，因為它是免費的，但一半的選項是為付費用戶保留的……這並不有趣。 最後我們有 科莫多巨蜥編輯，它非常好，功能強大且充滿選項，但它很重（中間有 100mb）並且配置它很煩人。
Web 開發人員或 Web 設計師最好的武器不是頂部有一千種武器的坦克風格的 IDE，而是一個簡單的文本編輯器、一些插件和像病人一樣打字的能力......添加魔力 禪宗編碼 您將擁有有史以來最好的標記工具（至少對我來說).
但是……他到底是什麼？ 禪宗編碼?
很簡單，它是一個特殊的插件，用作在中創建的 HTML 和 CSS 的下拉抽象層 使用Javascript 並可供許多最著名的出版商使用（notepad++、Komodo-edit、Gedit、Kate、Bluefish、Geany、Dreamweaver等）。
呃呃，我還是沒明白你在說什麼……
所以我用一個簡單的例子向你展示； 還記得下拉抽象嗎？ 好吧，將其更改為折疊，想像一下您可以將一行 HTML/CSS 代碼折疊成一行，然後將其像窗簾一樣展開或再次折疊......想看看如何？ 您只需確保有兩件事即可使其發揮作用：
有 禪宗編碼 安裝在您的編輯器中。
了解使用它的命令和語法。
好的，手指代碼：
html>head+body
看到那行代碼了嗎？ 這就是 HTML 的語法，很簡單：
首先輸入標籤的名稱 (html)，然後指示哪些標籤將位於該標籤內 (>)，然後指定該標籤內的標籤名稱（head 和 body）。 “+”號表示 head 和 body 是兩個不同的標籤，並且兩者都不包含在另一個標籤中，就像在說“在一起但不打亂«...所以，讓我們看看當按下魔術鍵時這行代碼會為我們生成什麼（就我而言 CTRL+E):
確切地說，4 行代碼合而為一，當您按下正確的組合鍵時，它們會神奇地出現……而且還可以有更多； 例如：
html>head+body>ul#lista_ordenada>li.listilla*5
相同的語法，但我們添加了其他內容...如果您了解 CSS，您會意識到我們正在添加 ID、類以及您肯定不知道的東西； 乘數……這是什麼！？ 該死的你讓我困惑！
冷靜點，這個很簡單，上面我們告訴你在body裡面輸入一個“ul”標籤，沒什麼奇怪的，我上面解釋了這一點，然後，我們分配了一個ID，如果你了解CSS你就會明白這些都是標識使用符號“#”，並在無序列表 (ul) 內添加五個帶有類 (class) listilla 的標籤，我將簡要解釋這一點。 其實很簡單，'#' 表示它是一個 ID，然後 'li.listilla' 表示我們必須創建一個帶有類 listilla «li class=listilla» 的標籤 «li»，然後，我們說 «重複最後五次«。 結果是：
一行編寫十二行代碼，花費的時間少得多 😉
這也可以通過 CSS 來完成，儘管我不會延長顯示明顯內容的文章（下面我將向您傳遞一份完整的作弊列表 禪宗編碼).
我必須指出，這並不能將無數行代碼合而為一，哦不，這有一個限制和一種使用它的方法。 例如，如果我們想做這樣的事情：
html>head>title+meta+body>ul#lista_ordenada>li.listilla*5
從理論上講，應該給我們什麼（看看最後一張圖中突出顯示的行）：
它會給我們這個：
這表明你也不能用它來施展魔法； 請記住，禪師的代碼必須精確且快速，而做壞事需要速度和時間，因此，正確的技巧是快速編寫代碼 禪宗編碼 會是這樣的：
html>head>body>ul#lista_ordenada>li.listilla*5
在 head 標籤內展開 y：
title+meta
這會給你正確的代碼：
雖然 禪宗編碼 還有很多東西要向您展示，也許必須在 head 中編寫另一個命令行並不是最好的，所以我們使用另一個命令，«用縮寫擴展“就我而言 Ctrl + Alt + E 這將打開一個小欄，我們可以在其中編寫 Zen 代碼並查看它如何實時顯示。 請注意，我不建議使用此選項編寫所有內容，而是在已創建的結構中編寫，即首先創建大型結構，然後使用此選項在其中繼續詳細說明。
並且裡面有很多超級有趣的命令 禪宗編碼，問題是，一旦安裝它們並學習如何使用它們，您就需要研究它們； 有了這個插件，你將不需要自動補全或 css 或 html 片段，事實上，有了這個你會意識到這些選項在這兩種編程語言中完全是浪費時間😉
對於那些感興趣的人，這裡是官方的 CheatSheet 禪宗編碼，你可以看到它的格式 ODF o PDF 胡斯托 這裡
我覺得超級有趣！
我一定會嘗試一下！
有一個問題，“head>body”形式不應該在 head 內創建 body 嗎？ 為了得到我們想要的東西，我們不應該放“頭+身體”嗎？
如果我感到困惑，我很抱歉！
謝謝
是的，任何前面帶有“">”的標籤名稱都表示它位於先前命名的標籤內； 在這種情況下，正如你所說， head>body 表示 body 將進入 head 內部，我們知道這是不正確的。
是的，head 加 body 就像連接一樣，你告訴它它們進入另一個標籤，但它們都不進入另一個標籤，在這種情況下 html>head+body
非常非常好，就我個人而言，我更喜歡使用純文本編輯器來處理此類事情，而 Zen Coding 是我見過的最好的 HTML 編輯器。
我非常喜歡這個： html:xt 對於那些想要繼續的人 html:5
嗯，我從來沒有真正使用過像 Dreamweaver 這樣的程序，我必須嘗試一下 Zen Coding 的東西......
PS：你的壁紙……有可能是我做的嗎？
是的，但是那一個 DesdeLinux
很好，一直很喜歡輕量級的文本編輯器，現在用的是 Geany 看到它支持魔法茶壺確實鼓勵我嘗試一下
好吧，編程不是我的專長，讓我害怕的是桌面，你用什麼，gnome 3 還是 unity，它是什麼主題？ 非常非常酷，讓我們看看我是否留下類似的
如果您不介意回答我，我將非常感激😀
PS：是的，我來自Windows，這就是大學所擁有的xD
Unity，具有基本主題並降低了面板的不透明度。
我工作中也是用windows，恭喜你，你的桌面很酷。
這篇文章非常有趣……我發現它很有用。 順便說一下，Gedit 的 Zen Coding 插件的安裝讓我有點措手不及，那就是你必須下載適合 Gedit3 的軟件包。 Zencoding 的官方網站上提供了 Gedit 插件的鏈接，但它已經過時了，因為它是針對 Gedit 2 的，這使得根據安裝說明無法在當前版本的 Gedit3 中使用它。
為版本 2 編寫的 Gedit 插件在新版本 3 中不起作用，因為它使用 GTK3，而 Gedit2 使用 GTK2。 要在 Gedit3 中使用插件，必須考慮以下因素：
新目錄：~/.local/share/gedit/plugins
.gedit-plugin 擴展名必須重命名為 .plugin
打開文件，編輯標題【Gedit Plugin】，修改為【Plugin】
還將 IAge=2 更改為 IAge=3
使用Gedit3的用戶可以從以下鏈接下載Zen Coding插件：
https://github.com/mtrovo/zen-coding-gedit3
希望對您有用。
問候。
謝謝，我正是遇到這個問題！
太棒了，你解決了我遇到的問題！ 謝謝！
非常有用，儘管對於 html 或任何面向網絡的語言和其他語言的編輯，我更喜歡 BlueFish 或 Aptana Studio。
的問候！
Bluefish 在一些事情上失敗了，比如能夠自定義鍵盤快捷鍵和其他東西，而且直到今天我還無法獲得自動完成的報價，這讓我擺脫了以後忘記關閉幾個的麻煩。
Aptana，它對我來說很糟糕，它只是用 Java 編寫的，並且具有危害我的系統的依賴項......更不用說對我來說（對我來說很好理解）Java = 垃圾。
我已經用了一段時間了，推薦！
你好，優秀的文章...
我不想感覺自己像一個禪宗大師:-)，但是你提出的擴展：
html>頭>標題+元+正文>ul#ordered_list>li.list*5
（無法展開）
可以使用括號正確完成分組，如下所示：
html>(頭>標題+元)+(正文>ul#ordered_list>li.list*5)
這按預期擴展
問候
該插件已停產並被 emmet 取代（http://emmet.io/)
有誰知道我如何在 Archlinux for kate 上安裝它？ 謝謝。