最近啊,我投奔了网页的开发,看了一本《head first HTML and CSS》的书,感觉非常不错,然后又配置了一些vim里面用到的插件,现在我把学习到的东西记录下来!

  首先,我不会在这里写emmet 的具体操作方法,你可以去官方自己看教程,如果英语不好的话,那么看这个朋友的博文,他把用到的教程都翻译成了中文http://www.cnblogs.com/matchless/tag/emmet/

  如果你试过在一个html文件中插入一个html5的模板,你就发现他的格式如下

  ps: 在插入模式输入 html:5  按下默认的快捷键,

  

  是不是感觉非常蛋疼,这个模板出现后,光标默认出现在body 标签之间,看到了吗?

  后来我改了一下,变成了如下这个样子

  ps:你会发现,上面那个模板是没有给出标题的(title元素里面没有内容,但是光标又在body里面,所以你每次都要把光标移动到title这里,是不是很蛋疼)

    我改了一下, 你可以按照我改后的模式输入 html:5{这个填写的是title的内容}

  如图所示

  

  按下默认的快捷键后,当当当当....................

  

  看到了把,这就是我修改的成果,接下来,给出方法

  提醒一下,我个人是不会用vimscript的,但是我看过一点,所以我能多多少少理解用vimscript写成的函数的功能是什么。

  而且,如果你想自己动手修改的话,请把emmet相关的文档教程看完,不然你不懂得为什么这样做

  官方上给出了一个订制的简单教程,说是用到  xxx.json 之类的文件,在这里我要提醒你,vim是不需要下载这类文件来订制的,他说的估计是sublime text之类的编辑器

  那么我们该怎么修改呢?

  其实,他的配置文件放在了emmet-vim/autoload/emmet.vim 这个文件里面,用编辑器打开 emmet.vim这个文件,在1420左右看到了 默认的html5模板

  

  注意,由于我的默认模板被我改了,所以我去github给出了默认的模板

  下图是我的修改

  

  你修改的时候要出去 最左边的 符号 ”\“  不能去掉,去掉会出错,然后说一下怎么配置, 符号 ”|“ 这个表示插入模板后光标出现的位置,${child} 这个的意思是 放入相关的内容,

  例如 a{xxxx}   ${child} =xxx  html:{xxxxxx}  ${child}=xxxx ,所以你只要在模板里面调整一下${child}的位置,就能很方便的插入标题的名字

  ps:原来默认的是插入html5模板只能这么用,而且不是自动插入标题

    html:5

    我的可以这么用

    html:5{标题}

    是不是很方便,

  最后说一下快捷键的设置

  在默认设置中,大部分命令都用到的快捷键是这个

  <c-y> ,          他的意思是 按下ctrl 键 和 y键  和  ,键(逗号)

  但是我觉得每次都输入那么多很麻烦,所以我写了一个mapping,把<c-y>改成了 F2,放在.vimrc文件里面

  let g:user_emmet_leader_key = '<F2>' "设置一下快捷键

  为什么是这样设置呢?我在这里就不说了 ,请看一下文档就懂了,

  我接下来的目标是学会了vimscript后,就开始写一个函数,让vim检测到文件名是.html的时候自动插入html5模板~!

  好了 加油了

最新文章

  1. JS命名空间
  2. 基于Ruby的Watir-WebDriver自动化测试方案
  3. noip2008-t3
  4. (1)编写一个接口ShapePara,要求: 接口中的方法: int getArea():获得图形的面积。int getCircumference():获得图形的周长 (2)编写一个圆类Circle,要求:圆类Circle实现接口ShapePara。 该类包含有成员变量: radius:public 修饰的double类型radius,表示圆的半径。 x:private修饰的double型变量x,
  5. SQLite剖析之功能特性
  6. shell截取字符串的方法
  7. MM 不哭 (tyvj 1097)
  8. sql语句not in判断条件注意事项
  9. POJ 3243 Clever Y (求解高次同余方程A^x=B(mod C) Baby Step Giant Step算法)
  10. python多线程threading
  11. ApplicationContext.xml 的最终xml声明,包括注解 aop
  12. 使用Apache Felix Remote Shell远程管理OSGI
  13. 10.使用final关键字修饰一个变量时...
  14. 智能电视TV开发---如何实现程序省电
  15. TFS 2010 使安装更容易,让VSS历史
  16. Object-C中Category类体验
  17. Element ui select同时获取value和label的值
  18. nginx配置多个域名
  19. Android如何着色字符串的特定部分
  20. MySQL简单查询语句练习

热门文章

  1. linux实践——简单程序破解
  2. poj1067-取石子游戏-wythoff博弈
  3. 20145208 实验二 Java面向对象程序设计
  4. &lt;实训|第四天&gt;Linux下的vim你真的掌握了吗?附上ftp远程命令上传。
  5. brew-cask之本地安装应用
  6. C#Json序列化和反序列化
  7. 10、面向对象以及winform的简单运用(isMdicontainer的设置、timer控件进行倒计时的制作)
  8. jQuery使用之(五)处理页面的事件
  9. Java 读取文件到字符串
  10. http状态码介绍