上篇介绍了文本编辑器 Notepad++,但是 Notepad++ 最优秀的不是它本身,而是它的可扩展性,拥有众多的插件是它在这么多的文本编辑器中脱颖而出的关键,(神器 vim 也是因为它的可扩展性),本篇文章就为大家介绍下我用的插件 QuickText 和 Zen Coding。

QuickText

QuickText 是一款很好用的 notepad++ 自动补全的插件,可以直接在插件管理器中直接更新,也可以在作者提供的源下载,点击下载 Quicktext 并解压缩。这里我选择了插件作者的源,HTML都厚道地做好了基本替换需要的东西,复制 QuickText.UNI.dll 和 QuickText.ANSI.dll 到 Notepad++ 安装目录下的 plugins 文件夹中。复制 QuickText.ini 到 Notepad++\plugins\config 目录下好了,重启 Notepad++,在插件下找到 Quicktext 菜单,默认的快捷键是 Tab,Options 里可以自定义自动补全

修改快捷键

设置>管理快捷键> pluging commands 里,修改成自己习惯的就行。

修改快捷键
自定义补全的语法

注意 "$" 是热点,也就是你的鼠标在补全后停留的位置, "\$" 输入$原符号, "\n" 换行。

Zen Coding

Zen Coding –一款使用仿 CSS 选择器的语法来快速开发 HTML 和 CSS 的插件。它无视了编辑器的自动提示和自动完成,秒杀了你自定义的各种快捷键,以智能简洁高效的缩短输入,带给你超快速地书写各种复杂而枯燥的 HTML 和 CSS 代码的体验。下载方式同样是在插件管理器中直接更新,修改快捷键等跟 QuickText 都是相似的,在这就不介绍了,下面是一个演示

Zen Coding

震惊吧,这样的插件写代码的速度完全不慢于 Dreamweaver 这样的专业软件,下面简介下 Zen Coding 的缩写规则

  • E
    元素名 (div, p);
  • E#id
    带id的元素 (div#content, p#intro, span#error);
  • E.class
    带class的元素 (div.header, p.error.critial). id 和 class 可以连写,如: div#content.column.width;
  • E>
    N 子元素 (div>p, div#footer>p>span);
  • E+N
    兄弟元素 (h1+p, div#header+div#content+div#footer);
  • E*N
    多项元素 (ul#nav>li*5>a);
  • E$*N
    带序号的元素 (ul#nav>li.item-$*5);

就是说,我输入 div#header>ul.navigation>li*4>a 这样的代码就会直接转换为如下的 HTML 代码

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

最后,Zen Coding 不仅有 Notepad++ 版的,UltraEdit、Dreamweaver,vim 都也有相应版本,大家可以去 官方下载