Editplus中Zen Coding手册
<div id="cnblogs_post_body">前面我介绍了一款优秀的代码编辑器Editplus，并且重点介绍了一下Zen Coding。但是Editplus最新版中包含了Zen Coding的功能，但是无论是帮助文档，还是官方的文档都缺少帮助文档。还好Zen Coding项目的帮助文档非常的丰富。我整理并测试了一下，Editplus基本实现了Zen Coding的所有的功能。如果你已经下载了最新版的Editplus或你的Editplus支持Zen Coding，那么你就点击下面的几个链接去学习使用。
[*]编辑HTML http://code.google.com/p/zen-coding/wiki/ZenHTMLElementsEn
[*]使用选择器 http://code.google.com/p/zen-coding/wiki/ZenHTMLSelectorsEn
[*]编辑CSS http://code.google.com/p/zen-coding/wiki/ZenCSSPropertiesEn
[*]使用Filter过滤器 http://code.google.com/p/zen-coding/wiki/Filters
[*]下载Cheatsheet http://code.google.com/p/zen-coding/wiki/CheatSheets
你学习了上面的一些资料以后，你需要知道以下一些内容。
[*]常用的缩写或HTML标记
[*]通过>+等创建不同层次结构的标记
[*]了解#id、.class、和{内容}，还有|e管道过滤器等
[*]*N和$*N循环以及$$$补零等
还需要了解Editplus的一些快捷键才能灵活自如的运行这项功能。
Expand Abbreviation展开缩写
Ctrl + E
Next Edit Point跳转到下一个编辑点
Ctrl + Alt + ]
Previous Edit Point跳转到前一个编辑点
Ctrl + Alt + [
Toogle Comment添加一个注释
Ctrl + /
最后我们通过一个简单的示例来结束本文。
[*]新建一个文档保存为YOUR-FILENAME.html
[*]输入html:5后Ctrl+E（如果你是基于模板新建的，可以省略这一步）
[*]在Body里面输入 div#page>(div#header>ul#nav>li*4>a)+(div#page>(h1>span)+p*2)+div#footer 后Ctrl+E展开
第3步展开后的代码如下所示：
<div id="page"><div id="header"><ul id="nav"><li><a href=""></a></li><li><a href=""></a></li><li><a href=""></a></li><li><a href=""></a></li></ul></div><div id="page"><h1><span></span></h1><p></p><p></p></div><div id="footer"></div></div>
页:
[1]