For faster navigation, this Iframe is preloading the Wikiwand page for Emmet.

Emmet

維基百科,自由的百科全書

Emmet(以前名為Zen Coding[1])是一套面向文字編輯器外掛程式,它允許通過內容輔助高速度的編寫和編輯HTMLXMLXSL和其他結構化的代碼格式。此專案2008年由Vadim Makeev發起[2],並由Sergey Chikuyonok和其他Emmet使用者基於Zen Coding 2.0的概念繼續積極開發。[3]這套工具已經被一些高階的文字編輯器採納,以及存在於Emmet團隊開發或其他人獨立實現的外掛程式中。不過,Emmet獨立於任何文字編輯器,它的引擎可以直接處理文字,而無需與任何特定軟體相關。[4]

Emmet以MIT許可證開源。

功能

展開縮寫

Emmet使用特定的語法來展開小段代碼,它類似CSS選擇器,使其成為完整的HTML代碼。[5]例如,下列序列:

div#page>div.logo+ul#navigation>li*5>a

將展開為:

<div id="page">
	<div class="logo"></div>
	<ul id="navigation">
		<li><a href=""></a></li>
		<li><a href=""></a></li>
		<li><a href=""></a></li>
		<li><a href=""></a></li>
		<li><a href=""></a></li>
	</ul>
</div>

展開縮寫函式包含數個更加複雜的函式,例如用展開的代碼包裝一段代碼。[6]

標籤平衡

HTML配對匹配器允許使用者定位當前游標位置的標籤所對應的開啟/閉合標籤(Tag)。不同於其他HTML配對匹配器,Emmet會從游標的當前位置開始搜尋,而非從頭開始掃描文件。[7]

文字編輯器

Emmet團隊為以下文字編輯器開發了外掛程式:

下列文字編輯器由第三方組織用官方Emmet引擎開發了外掛程式:

下列文字編輯器的外掛程式為獨立開發,使用不同的Emmet引擎:

參考資料

  1. ^ Rocha, Zeno. Goodbye, Zen Coding. Hello, Emmet!. Smashing Magazine GmbH. March 26, 2013 [March 15, 2015]. (原始內容存檔於2015-05-11). 
  2. ^ First announcement of Zen HTML and Zen CSS bundles for TextMate. [2017-05-22]. (原始內容存檔於2017-03-23). 
  3. ^ Zen Coding 2.0 concept. [2017-05-22]. (原始內容存檔於2017-06-24). 
  4. ^ Smashing Magazine: Zen Coding: A Speedy Way To Write HTML/CSS Code. [2017-05-22]. (原始內容存檔於2015-06-24). 
  5. ^ Monday By Noon: The Art of zen-coding: Bringing Snippets to a New Level. [2017-05-22]. (原始內容存檔於2016-06-12). 
  6. ^ Download Squad Review. [2017-05-22]. (原始內容存檔於2019-10-22). 
  7. ^ Smashing Magazine: Zen Coding: A Speedy Way to Write HTML/CSS Code. [2017-05-22]. (原始內容存檔於2015-06-24). 

外部連結

{{bottomLinkPreText}} {{bottomLinkText}}
Emmet
Listen to this article

This browser is not supported by Wikiwand :(
Wikiwand requires a browser with modern capabilities in order to provide you with the best reading experience.
Please download and use one of the following browsers:

This article was just edited, click to reload
This article has been deleted on Wikipedia (Why?)

Back to homepage

Please click Add in the dialog above
Please click Allow in the top-left corner,
then click Install Now in the dialog
Please click Open in the download dialog,
then click Install
Please click the "Downloads" icon in the Safari toolbar, open the first download in the list,
then click Install
{{::$root.activation.text}}

Install Wikiwand

Install on Chrome Install on Firefox
Don't forget to rate us

Tell your friends about Wikiwand!

Gmail Facebook Twitter Link

Enjoying Wikiwand?

Tell your friends and spread the love:
Share on Gmail Share on Facebook Share on Twitter Share on Buffer

Our magic isn't perfect

You can help our automatic cover photo selection by reporting an unsuitable photo.

This photo is visually disturbing This photo is not a good choice

Thank you for helping!


Your input will affect cover photo selection, along with input from other users.