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. Django之url路由

    Django之url路由 url路由介绍 url路由是关联url及其视图函数关系的过程. 作用就是使views里面处理数据的函数与请求的url建立映射关系 url路由配置 Django的url路由配置 ...

  2. datatables数据渲染自定义

    "data": "ip",渲染回调函数中的data['ip']字段将传给render函数中的data:render函数的返回内容将代替"data&qu ...

  3. [ 高危 ] mt网主站SQL注入

    rank  75 金币  75 等价RMB  750 数据包样式如下 POST /ajax.php HOST: xxx.meituan.com Cookie: xxx id=123&job= ...

  4. spring mvc简单介绍xml版

    spring mvc介绍:其实spring mvc就是基于servlet实现的,只不过他讲请求处理的流程分配的更细致而已. spring mvc核心理念的4个组件: 1.DispatcherServl ...

  5. 爆炸销毁动画组件Explosions

    爆炸销毁动画组件Explosions   爆炸销毁动画通常应用于界面元素的移除.使用该动画效果可以将移除操作表现的更为直观生动.Explosions组件是一款专门实现爆炸销动画效果的组件,它可以展示界 ...

  6. 前面的内容 也是要去掉白名单 和 8.8.8.8这种非问题IP的 高风险 么? (目前我们没有获取客户的中风险、低风险数据,可以处理掉高风险)

    前面的内容 也是要去掉白名单  和 8.8.8.8这种非问题IP的 高风险 么?   (目前我们没有获取客户的中风险.低风险数据,可以处理掉高风险) == 整体把关.不清楚细节,所以只能从整体决策.做 ...

  7. 近年NOIP考点与主要做法

  8. Ruby用百度搜索爬虫

    Ruby用百度搜索爬虫 博主ruby学得断断续续,打算写一个有点用的小程序娱乐一下,打算用ruby通过百度通道爬取网络信息. 第三方库准备 mechanize:比较方便地处理网络请求,类似于Pytho ...

  9. Linux内容

    1.“~”:当前用户主目录“.”:当前工作目录“..”:当前工作目录的父目录使用pwd命令可以确定当前所在目录的绝对路径$ pwd2.shell命令:(which命令判断是否是外部命令)$ which ...

  10. vscode rn代码格式化配置

    安装Beautify和React-beautify扩展程序,并在项目根目录创建配置文件.jsbeautifyrc,并复制下面代码到此配置文件里: { "mode": "b ...