vim插件ZenCoding一些常用的操作

相当的酷，记录一些常用的操作

安装很方便，不再像我以前使用的sparkup.vim得配置python环境了，可直接到http://github.com/mattn/zencoding-vim下载zencoding.vim文件放到vimfiles/plugin或.vim/plugin目录就OK了。

接下来介绍些使用方法（Copy自LazyHack的使用zen coding for vim快速编写html代码）

• 展开缩写

  输入?div>p#foo$*3>a?这样的缩写,然后按?ctrl + y + ,?来展开(注意那个逗号)，展开后它应该是这个样子的

   <div>      <p id="foo1">          <a href=""></a>      </p>      <p id="foo2">          <a href=""></a>      </p>      <p id="foo3">          <a href=""></a>      </p>  </div>

  • 多行缩写

    输入如下:

    test1test2test3

    然后进入行选择模式，选中这三行按?ctrl + y + ,，接着它会提示你要使用的tag名称，TAG: 输入 ‘ul>li*?会变成如下的样子

    <ul>    <li>test1</li>    <li>test2</li>    <li>test3</li></ul>

    如果是输入blockquote，那么会变成这样

      <blockquote>      test1      test2      test3  </blockquote>

    • 跳转到下一个标签编辑位置

      输入ctrl + y + n?进入插入模式

      • 跳转到上一个标签编辑位置

        输入ctrl + y + N?进入插入模式

        • 更新标签中图片大小

          假如有以下内容

          <img src="foo.png" />

          光标移动到img标签上，按下ctrl + y + i?该插件会自动获取foo.png的大小并插入宽高属性 看起来像这个样子

          <img src="foo.png" width="32" height="48" />

          • 切换注释

            如有以下段

            <div>    hello world</div>

            光标移动到此段落，输入ctrl + y + /变成

            <!-- <div>    hello world</div> -->

            再次输入则还原

            • 生成url连接

              将光标移动到一个url上，如：

              http://www.google.com/

              输入ctrl + y + a?它会自动获取url页面的标题并生成一个连接

              <a href="http://www.google.com/"></a>

              zencoding.vim更新十分频繁，大家可以关注下。

              VIM官方插件地址：http://www.vim.org/scripts/script.php?script_id=2981

              zencoding.vim在Github的地址：http://github.com/mattn/zencoding-vim

              Zen Coding官方地址：http://code.google.com/p/zen-coding/

              Zen Coding官方提供的速查手册(PDF)：http://zen-coding.googlecode.com/files/ZenCodingCheatSheet.pdf