sublime Text2技巧以及emmet(Zen Coding)快速编写HTml

作为一个前端，有一款好的开发利器是必不可少的，editplus、notepad++都是不错的工具，体积轻巧，启动迅速（dw太浮肿了）。Sublime Text2是一款跨平台的编辑器，是一款具有代码高亮、语法提示、自动完成且反应快速的编辑器软件，不仅具有华丽的界面，还支持插件扩展机制。

zen coding 一种快速编写HTML/CSS代码的方法，已改名为Emmet，并且搭建了一个新的网站：docs.emmet.io

Sublime Text 2安装插件Emmet后，打开sublime Text2输入代码ul>li*4>a{Links$} ，按Tab键生成下面一段代码：

 

Emmet 插件的安装：

打开Sublime Text 2，首先，我们需要安装Package Contro，ctrl+`调出命令行工具，输入import urllib2,os;pf='Package Control.sublime-package';ipp=sublime.installed_packages_path();os.makedirs(ipp) if not os.path.exists(ipp) else None;open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen('http://sublime.wbond.net/'+pf.replace(' ','%20')).read())

回车即可。

点击Preferences→Package Control，显示以下弹窗，选择Install Package

 

之后再输入Emmet来找到要安装的包，安装后就可以使用了。

 

使用Emmet编写代码时，需要遵循一定的缩写规则：

• E
  元素名（div、p）；
• E#id
  带Id的元素（div#content、p#intro、span#error）；
• E.class
  带class的的元素（div.header、p.error）,id和class可以连着写，div#content.column
• E>N
  子元素（div>p、div#footer>p>span）
• E*N
  多项元素（ul#nav>li*5>a）
• E+N
  多项元素
• E$*N
  带序号的元素

 

Sublime Text 中的其他插件：

jQuery Package for sublime Text

如果你离不开jQuery的话，这个必备～～

Sublime Prefixr

Prefixr，CSS3 私有前缀自动补全插件，显然也很有用哇

JS Format

一个JS代码格式化插件。

Placeholders

故名思意，占位用，包括一些占位文字和HTML代码片段，实用。

Sublime Alignment

用于代码格式的自动对齐。传说最新版Sublime 已经集成。

Tag
一些有代码洁癖的程序猿很适合这个插件，HTML代码格式化能使html代码更加漂亮整洁。

JsMinifier

该插件基于Google Closure compiler，自动压缩js文件。

Sublime CodeIntel

代码自动提示

Bracket Highlighter

类似于代码匹配，可以匹配括号，引号等符号内的范围。

GBK to UTF8

将文件编码从GBK转黄成UTF8，快捷键Ctrl+Shift+C

 

主要快捷键

Ctrl+L 选择整行（按住-继续选择下行）

Ctrl+KK 从光标处删除至行尾

Ctrl+Shift+K 删除整行

Ctrl+Shift+D 复制光标所在整行，插入在该行之前

Ctrl+J 合并行（已选择需要合并的多行时）

Ctrl+KU 改为大写

Ctrl+KL 改为小写

Ctrl+D 选词 （按住-继续选择下个相同的字符串）

Ctrl+M 光标移动至括号内开始或结束的位置

Ctrl+Shift+M 选择括号内的内容（按住-继续选择父括号）

Ctrl+/ 注释整行（如已选择内容，同“Ctrl+Shift+/”效果）

Ctrl+Shift+/ 注释已选择内容

Ctrl+Z 撤销

Ctrl+Y 恢复撤销

Ctrl+M 光标跳至对应的括号

Alt+. 闭合当前标签

Ctrl+Shift+A 选择光标位置父标签对儿

Ctrl+Shift+[ 折叠代码

Ctrl+Shift+] 展开代码

Ctrl+KT 折叠属性

Ctrl+K0 展开所有

Ctrl+U 软撤销

Ctrl+T 词互换

Tab 缩进 自动完成

Shift+Tab 去除缩进

Ctrl+Shift+↑ 与上行互换

Ctrl+Shift+↓ 与下行互换

Ctrl+K Backspace 从光标处删除至行首

Ctrl+Enter 光标后插入行

Ctrl+Shift+Enter 光标前插入行

Ctrl+F2 设置书签

F2 下一个书签

Shift+F2 上一个书签