首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 其他教程 > 开源软件 >

vim插件ZenCoding一些惯用的操作

2013-02-05 
vim插件ZenCoding一些常用的操作相当的酷,记录一些常用的操作安装很方便,不再像我以前使用的sparkup.vim得

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

热点排行