Emmet是一款Web前端开发工具Sublime非常有用的插件,使用仿CSS选择器的语法来生成代码,大大提高了HTML和CSS代码编写的速度,只需按住Tab键即可把一个简写展开成HTML和CSS的代码块。

在安装Emmet插件之前我们首先需要在Sublime Text3上安装Package Control插件管理器。
安装步骤:
  1.按Ctrl+`调出sublime text的console
  2.粘贴以下代码到底部命令行并回车:

  import urllib2,os;pf='Package Control.sublime-package';ipp=sublime.installedpackagespath();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())

  3.重启Sublime Text
  4.在Perferences->package settings中看到package control,则表示安装成功

按住快捷键Ctrl+Shift+P或者在菜单栏选择Perferences-->Package Control即可打开命令面板,如若没有反应稍等一下便会弹出。

打开命令面板找到package control install package,或者在命令面板输入"pcip"即这四个单词的首字母,便会出现新的安装package的面板,然后输入emmet找到Emmet Css Snippets,点击后便会自动安装。
安装完成后可通过Perferences-->Package Settings-->Emmet查看是否成功,如果Emmet在说明安装成功了。

安装完成后我们利用Emmet插件去快速生成HTML代码,例如输入html:5按住Tab键即可生成HTML文件完整的结构,但是很多人在安装完成后输入html:5然后按住Tab键并没有反应,这是什么原因导致的呢?原来Emmet默认的快捷键是Ctrl+E,我们需要将其设置成常用的Tab键。
在菜单栏选择Preferences-->PackageSettings-->Emmet-->KeyBindings-->User,将以下信息粘贴进去即可:
[{"keys": ["tab"], "args": {"action": "expand_abbreviation"}, "command": "run_emmet_action", "context": [{"key": "emmet_action_enabled.expand_abbreviation"}]}]

重启Sublime Text3此时我们便可以进行代码补全操作了,在新创建的文件上输入html:5,按住Tab键即可看到如下的代码。

Sublime插件Emmet的安装及Tab补全代码的更多相关文章

  1. 虚拟机 ---- 最小化安装无法使用tab补全键

    解决方法: 安装 yum -y install bash-completion 然后重启 注意:挂载时使用绝对路径的cdrom挂载,  ls -l /dev/cdromvim /etc/fstab — ...

  2. centos7最小化安装无法tab补全

    yum install -y bash-completion 安装完后reboot重启生效

  3. sublime插件emmet的配置、使用及快捷键Ctrl+E修改成Tab键操作

    一.emmet在sublime中的配置与使用: 1.点击sublime text 3的图标,打开编辑器: 2.按键“ctrl+shift+p”,或者单击菜单->工具->命令面板: 3.打开 ...

  4. centos7安装python3 以及tab补全功能

    1.安装python3 1.1下载python源码包 网址:https://www.python.org/downloads/release/python-362/ 下载地址:https://www. ...

  5. 9.3centos7安装python3 以及tab补全功能

    1.安装python3 1.1下载python源码包 网址:https://www.python.org/downloads/release/python-362/ 下载地址:https://www. ...

  6. 在vim编辑器python实现tab补全功能

    在vim编辑器中实现python tab补全插件有Pydiction,Pydiction可以实现下面python代码的自动补全: 1. 简单python关键词补全 2. python函数补全带括号 3 ...

  7. 在vim编辑器中实现python的tab补全

    在vim编辑器中实现python的tab补全 在vim编辑器中实现python tab补全插件有Pydiction,Pydiction可以实现下面python代码的自动补全:   1.简单python ...

  8. vim编辑python脚本时Tab补全

    所属分类:成长之路 使用Linux写python脚本的时候,初期最痛苦的是什么?当然是各种库的不熟悉,知道了库,里面的方法还要挨个看,挨个记. 所以这时候,很多小伙伴使用了ipython,最强大的功能 ...

  9. 解决debian (Friendly ARM 嵌入式板)的sudo等一部分命令无法TAB补全

    TAB对于比较长的命令在使用时是十分方便的,最近就遇到TAB 键无法补全sudo后跟的命令的情况因此去网上取经.在一篇博客中找到解决问题的方法,觉得大牛们写的太精炼然后自己做如下总结方便自已以后解决类 ...

随机推荐

  1. Sort功能极强!

    Sort功能极强! 可以排string:  sort(a.begin(),a.end()); 普通数组 结合结构体 逆序 而且贼快

  2. unity3d俄罗斯方块源码教程+源码和程序下载

    小时候,大家都应玩过或听说过<俄罗斯方块>,它是红白机,掌机等一些电子设备中最常见的一款游戏.而随着时代的发展,信息的进步,游戏画面从简单的黑白方块到彩色方块,游戏的玩法机制从最简单的消方 ...

  3. SpringMVC之搭建框

    1. 创建Web工程 2. 修改环境配置 2.1 背景:因为创建的web工程,classe文件默认保存在build/classes里,而WEB-INF下的文件无法通过外部访问,更加安全,所以修改cla ...

  4. Yahoo Programming Contest 2019.D.Ears(DP)

    题目链接 菜爆了啊QAQ 记起点为\(S\),终点为\(T\),走过的最靠左的点是\(L\),最靠右的点是\(R\). 那么坐标轴被分成了五段: \(0\sim L-1\):经过\(0\)次: \(L ...

  5. BZOJ.2324.[ZJOI2011]营救皮卡丘(费用流 Floyd)

    BZOJ 洛谷 首先预处理出\(dis[i][j]\),表示从\(i\)到\(j\)的最短路.可以用\(Floyd\)处理. 注意\(i,j\)是没有大小关系限制的(\(i>j\)的\(dis[ ...

  6. Java实现FTP与SFTP文件上传下载

    添加依赖Jsch-0.1.54.jar <!-- https://mvnrepository.com/artifact/com.jcraft/jsch --> <dependency ...

  7. idea中Hibernate反向生成工具

    HIbernate反向生成工具 1.使用idea数据库集成工具连接所需数据库 第一步 View-->Tool windows---->Database 第二步 找到所需连接的数据库 第三步 ...

  8. BZOJ1515 : [POI2006]Lis-The Postman

    首先,如果这个图本身就不存在欧拉回路,那么显然无解. 对于每个子串: 1.如果里面有不存在的边,那么显然无解. 2.如果里面有一条边重复出现,那么显然也无解. 3.对于每条边,维护其前驱与后继,若前驱 ...

  9. JS 引用类型之Object

    引用类型定义: 描述一类对象具有的属性和方法 引用类型Object ,也就是我们常说的对象类型了,这应该是JavaScript中最常见的引用类型了. 对象是某个引用类型的实例,如何创建一个实例,也就是 ...

  10. bzoj1531: [POI2005]Bank notes(多重背包)

    1531: [POI2005]Bank notes Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 521  Solved: 285[Submit][Sta ...