Aptana+Zen Coding,UltraEdit+Zen Coding,Dreamwaver+Zen Coding 超快写HTML无敌！

Zen Coding写HTML和CSS真是超爽无敌了，输入：

div#header>ul.navigation>li*4>a

按下快捷键，输出：

<div id=”header”>

    <ul class=”navigation”>

        <li><a href=”"></a></li>

        <li><a href=”"></a></li>

        <li><a href=”"></a></li>

        <li><a href=”"></a></li>

    </ul>

</div> 

输入：

div.mod.mod1>div.inner>div.hd+div.bd>ul>li*10>a

按下快捷键，输出 ：

<div class="mod mod1">

    <div class="inner">

        <div class="hd"></div>

        <div class="bd">

            <ul>

                <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>

                <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>

    </div>

</div>

超酷匹配选择器！

 

更多html转换规则详见： http://code.google.com/p/zen-coding/wiki/ZenHTMLElementsEn

更多css转换规则详见： http://code.google.com/p/zen-coding/wiki/ZenCSSPropertiesEn

 

其实Zen Coding出来很久一段时间了，最近有时间折腾了一下，确实爽。Zen Coding 支持很多编辑器：

 

1. Aptana+Zen Coding配置方法及详细介绍

2. UltraEdit+Zen Coding配置方法

3. EditPlus+Zen Coding配置方法

4. Dreamwaver+Zen Coding详细配置

5. VS2008+Zen Coding配置方法

6. VIM+Zen Coding详细配置

 

据我看写html效率可以提升30%以上，甚至很多尝试过Zen Coding的人都说它改变了他们写页面的方式！