【Zen Coding可谓快速开发HTML和CSS的利器，主要采用仿css类选择器方式编写代码，以下是该利器的基本语法规则和代码示例】
【Zencoding代码】
1 <html> 2 <head> 3 <title></title> 4 <style></style> 5 <script src="abc1.js"></script> 6 <script src="abc2.js"></script> 7 <script src="abc3.js"></script> 8 <body> 9 <div class="footer">版权信息 10 <div class="content"> 11 <div class="nav"> 12 <ul> 13 <li><a href=""><span></span></a></li> 14 <li><a href=""><span></span></a></li> 15 <li><a href=""><span></span></a></li> 16 <li><a href=""><span></span></a></li> 17 <li><a href=""><span></span></a></li> 18 </ul> 19 </div> 20 </div> 21 <div class="sidebar"> 22 <div class="top"></div> 23 <div class="middle"></div> 24 <bottom></bottom> 25 </div> 26 <div class="main"> 27 <div class="acticle"> 28 <h1>文章标题1</h1> 29 <p></p> 30 </div> 31 <div class="acticle"> 32 <h1>文章标题2</h1> 33 <p></p> 34 </div> 35 <div class="acticle"> 36 <h1>文章标题3</h1> 37 <p></p> 38 </div> 39 </div> 40 </div> 41 </body> 42 </head> 43 </html>
原文：http://www.cnblogs.com/luojun/p/6475356.html