Sublime Text
- 安装包控制器(package control):只有安装了包控制器才能安装各种神队友的插件。
MacOS:菜单栏-->Tools-->Install package control
Windows: 1.按Ctrl+~呼出命令控制器。2.将下面的命令复制到命令栏中后按回车。看到成功的提示重启就能看到Package Control了。
命令如下:
import urllib.request,os,hashlib; h = 'df21e130d211cfc94d9b0905775a7c0f' + '1e3d39e33b79698005270310898eea76'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)
- 安装插件
- 打开Command Palette(Ctrl/Command+Shift+p),选择 Package Control: Install Package;
- 出来后再命令栏上输入插件名称,点击相应插件就开始安装,跳出信息界面就证明安装成功!
推荐安装的插件如下:
1. Emmet (快速编写html/css)
2. Html5
使用方法:新建html文档>输入html5>敲击Tab键>自动补全html5规范文档
2. BracketHighLighter(高亮显示匹配的括号、引号和标签)
3. ColorHightLighter(显示所选颜色值的颜色)
4. CSS Format(css代码格式化,即快速展开/压缩代码)
5. Alignment(代码对齐)
使用方法:选中需要对齐的代码>按住Ctrl+Alt+A(Command+
Control+A)
6. HtmlBeautify(html代码格式化)
使用方法:选中需要格式化的代码片段>按住"Command/Control+alt+shift+f"
7. SublimeTmpl(快速生成文件模板)
使用方法:SublimeTmpl默认的快捷键如下,如果快捷键设置冲突可能无效。
Ctrl/Control+Alt+h 新建 html 文件
Ctrl/Control+Alt+j 新建 javascript 文件
Ctrl/Control+Alt+c 新建 css 文件
Ctrl/Control+Alt+p 新建 php 文件
Ctrl/Control+Alt+r 新建 ruby 文件
Ctrl/Control+Alt+Shift+p 新建 python 文件
8. ConvertToUTF8
功能说明:ConvertToUTF8 能将除UTF8编码之外的其他编码文件在 Sublime Text 中转换成UTF8编码,在打开文件的时候一开始会显示乱码,然后一刹那就自动显示出正常的字体,当然,在保存文件之后原文件的编码格式不会改变。
9. JQuery Snippets pack(JQuery代码提示)
10. DocBlockr(注释插件)
11. Advanced New File(快速创建新文件)
使用方法: 按住Ctrl/Command+alt+n底部调出编辑新文件名界面>输入路径/文件名
12. ColorPicker(调出颜色拾取器)
使用方法:Ctrl/Command+shift+c
13. JsFormat(JavaScript代码格式化)
14. AutoFileName(自动补全文件/目录名)
15. View In Browser(在浏览器中打开页面)
快捷键:Ctrl+alt+v(Control+Option+v)
Emmet插件语法:
后代 :>
举例:nav>ul>li
兄弟:+
举例:div+p
上级:^
举例:div+div>p>span^p
分组:()
举例:div>(header>ul>li2)+footer
乘法:
举例:ul>li5
自增符号:举例:ul>li.item5
自定义属性
举例:td[rowspan=2 colspan=3]
文本:{}
举例:span{Click me}
快捷写法:
html
举例:form:get
<form action="" method="get"></form>
举例:meta:utf
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
举例:meta:vp
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
举例:meta:utf
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
举例:input:text
<input type="text" name="" id="">
css:
position:pos,pos-a,pos-f...
cursor:cur-p,cur-t...
font:f+,fw-b,fz...
text-align:ta,ta-c,ta-l...
background-color:bgc
background-image:bgi
- 快捷键
- 分屏:
Alt+Shift+1 Single 独屏
Alt+Shift+2 Columns:2 纵向二栏分屏
Alt+Shift+3 Columns:3 纵向三栏分屏
Alt+Shift+4 Columns:4 纵向四栏分屏
Alt+Shift+8 Rows:2 横向二栏分屏
Alt+Shift+9 Rows:3 横向三栏分屏
Alt+Shift+5 Grid 四格式分屏