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. spring boot默认访问静态资源

    演示spring boot默认可以直接访问静态资源的2种方法: 第一种:在src/main/resources资源目录下创建一个名为"static"的文件夹(该文件夹的名称是规定死 ...

  2. SpringMVC(二七) 自定义视图

    可以参考博客http://www.cnblogs.com/parryyang/p/5683600.html,举例很清晰. 对自定义的视图名称匹配不同的解析器进行解析. 作用:自己定义视图,视图继承vi ...

  3. 服务链路追踪---Sleuth

    Sleuth:日志收集工具包,封装了Dapper和log-based追踪以及Zipkin和HTrace操作,为SpringCloud应用实现了一种分布式追踪解决方案. 当服务与服务之间调用复杂时,Sp ...

  4. DataGridView获取或者设置当前单元格的内容

    当前单元格指的是DataGridView焦点所在的单元格,它可以通过DataGridView对象的CurrentCell属性取得.如果当前单元格不存在的时候,返回null. 取得当前单元格的内容: o ...

  5. 蓝桥杯——代表团出访——C++

    问题描述: X星球要派出一个5人组成的观察团前往W星. 其中: A国最多可以派出4人. B国最多可以派出2人. C国最多可以派出2人. D国最多可以派出1人. E国最多可以派出1人. F国最多可以派出 ...

  6. 潭州课堂25班:Ph201805201 django 项目 第十七课 用户登录,登出实现 (课堂笔记)

    登录,校验: 1,判断用户名输入是否为空, 2,判断用户名密码是否匹配, 3,记住我的功能,:将用户信息记到 session 中 请求方式: POST 在视图中: # 1,创建类# 2,获取前台参数# ...

  7. web界面直连MySql数据库

    <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding= ...

  8. unique_ptr_c++11

    unique_ptr 替代了原来的auto_ptr,指向对象具有唯一性,即同一时间只能有unique_ptr指向给定对象(和auto_ptr不同是禁止拷贝语义,通过移动语义替代) unique_ptr ...

  9. django之模板继承以和模板导入

    1,模板继承 一,模板继承 1.在template下面新建一个master.html的文件,当做母版. 2. 母版里需要被替代的部分,以block开始,以endblock结尾 {% block con ...

  10. CSS_盒子模型

    2016-10-22 <css入门经典>第6章 1.每个HTML元素对应于一个显示盒子,但不是所有的元素都显示在屏幕上. 2.HTML元素显示为CSS显示盒子的真正方法称为“可视格式化方式 ...