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. 004.Heartbeat+HAProxy+MySQL半复制高可用架构

    一 基础环境 节点 系统版本 MySQL版本 业务IP 心跳IP Master CentOS 7.5 MySQL 5.6 192.168.88.100 192.168.77.100 Slave Cen ...

  2. ddctf2019--web部分writeup

    0x00前言 上周五开始的DDCTF 2019,整个比赛有一周,题目整体来说感觉很不错,可惜我太菜了,做了4+1道题,还是要努力吧 0x01 web 滴~ 打开看着url,就像文件包含 文件名1次he ...

  3. 解决Intellij IDEA部署JavaWeb项目 404问题

    今天朋友问了我一个问题,他的公司项目用idea启动tomcat是成功的, 但是访问页面是404.一般来说,这个问题普遍都是打war包的时候配置有一定的问题导致的. 检查一下Project Struct ...

  4. CSS选择器、样式、盒模型

    一.CSS基础选择器 # 1.*(通配选择器):html,body以及body下用于显示的标签 #html和body颜色会被改变,但是div标签不会发生改变,由于不同的选择器具有优先级 # 语法:* ...

  5. OI考试需注意的

    能用结构体就用结构体,特别是队列之类的数据结构:类别相同的变量或数组名字不要太相近,最好在名字后面加上标识符(e.g:hash[]&HASH[]就不好,hash1[]&hash2[]正 ...

  6. 如何去掉linux配置文件的注释行和空行

    1.使用grep -v "^#"  来去掉注释行,其中:-v  就是取相反的   ^# 表示以#开头的行 eg. grep -v "^#" /etc/vsftp ...

  7. [USACO18DEC]The Cow Gathering

    Description: 给定一棵树,每次删去叶子,有m个限制,分别为(a,b)表示a需要比b先删,为每个点能否成为最后被删的点 Hint: \(n,m \le 10^5\) Solution: 手模 ...

  8. C++学习笔记50:队列类模板

    队列是只能向一端添加元素,从另一端删除元素的线性群体 循环队列 在想象中将数组弯曲成环形,元素出队时,后继元素不移动,每当队尾达到数组最后一个元素时,便再回到数组开头. 队列类模板 //Queue.h ...

  9. MyBatis 作用域(Scope)和生命周期

    SqlSessionFactoryBuilder SqlSessionFactoryBuilder的作用是创建SqlSessionFactory.一旦创建了SqlSessionFactory,就不再需 ...

  10. Centos服务器端口无法访问

    使用GPRS A6 模块进行TCP连接的时候,一度认为A6模块坏掉了 最终只是服务器端口都被防火墙堵住了 使用之前一直用的  service iptables stop  找不到iptables 原来 ...