好用的zen-coding

早上在某神人(gasolin)的噗浪上看到的...

如果需要手工刻css+html时，你的编辑器刚好有支援，那就省事了。
虽然方便，但前提是你已经熟悉css selector，不然恐怕还是一头雾水。

这个工具可以让你用css selector语法反向产出html！例如，你在编辑器中输入：

div[onclick="Module.panelhandler"]#panel.class1>p.section1+p.section1

他可以帮你展开成html：

<div onclick="Module.panelhandler" id="panel" class="class1"><p class="section1"></p><p class="section1"></p></div>

如果要产生一串list：

ul.menu>li.item*5

他就帮你展开：

<ul class="menu"><li class="item"></li><li class="item"></li><li class="item"></li><li class="item"></li><li class="item"></li></ul>

等等，还有许多好用的语法，可以上官网：http://code.google.com/p/zen-coding/找找看使用方式。里面也可以找到支援的编辑器列表...（嗯嗯，Notepad++有支援，其他还有很多，可惜我常用的ultraedit有点跛脚...）

更进阶的功能据说还可以让你把内容与selector做matching，然后组出完整的html，不过好像还在开发中。