Emmet是一款Web前端开发工具Sublime非常有用的插件,使用仿CSS选择器的语法来生成代码,大大提高了HTML和CSS代码编写的速度。只需按住Tab键即可把一个简写展开成HTML和CSS的代码块,如下图所示,大部分标签都可自动生成。介绍一种使用在线安装的方式来安装Emmet插件。

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

打开命令面板找到package control install package,或者在命令面板输入"pcip"即这四个单词的首字母,便会出现新的安装package的面板,搜索emmet找到后点击回车键,稍后便会自动安装。

安装完成后可通过Perferences-->Package Settings-->Emmet查看是否成功,如果Emmet在说明安装成功了。

  1. 安装完成后我们利用Emmet插件去快速生成HTML代码,例如输入html:5按住Tab键即可生成HTML文件完整的结构,但是很多人在安装完成后输入html:5然后按住Tab键并没有反应,这是什么原因导致的呢?原来Emmet默认的快捷键是Ctrl+E,我们需要将其设置成常用的Tab键。

  2.  

    在菜单栏选择Preferences-->PackageSettings-->Emmet-->KeyBindings-->User,将以下信息粘贴进去即可。

    [{"keys": ["tab"], "args": {"action": "expand_abbreviation"}, "command": "run_emmet_action", "context": [{"key": "emmet_action_enabled.expand_abbreviation"}]}]

  3. 7

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

sublime下载emmet的更多相关文章

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

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

  2. sublime Text emmet插件使用手册

    转自:http://www.w3cplus.com/tools/emmet-cheat-sheet.html 介绍 Emmet (前身为 Zen Coding) 是一个能大幅度提高前端开发效率的一个工 ...

  3. Sublime text3 Emmet使用

    Emmet需要配置pyv8 进入 https://github.com/emmetio/pyv8-binaries 下载解压文件放入Sublime Installed Packages下面 就可以使用 ...

  4. sublime text3 Emmet (原zenCoding)安装方法

    1.安装使用Package Control组件安装 (1)打开控制台 (mac)control+`; (win)ctrl+` (2)复制一下代码并回车 import urllib.request,os ...

  5. sublime Text3+emmet(快速开发)

    sublime软件使用Emmet插件快速编写CSS样式                    基本的CSS样式编写时,很多样式只需输入首字母即可得到不带属性值的CSS样式,像上面说到的margin.而 ...

  6. Sublime插件Emmet的安装及Tab补全代码

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

  7. sublime 下载 和 破解

    新增可用注册码,无需降级. Sublime Text 3.1 更改了验证方法,之前所有的验证码都已失效,建议降级到3143 版本. 新增3.1 3176 可用注册码 此验证码为sublime text ...

  8. sublime安装emmet

    1,先安装package install 2,然后安装emmet,安装完后会自动load加载Pyv8,如果加载不成功只能手动下载(详情可以百度).

  9. Sublime Text Emmet插件 : 生成html,css 快捷键

    (输入下面简写,按Tab键可触发效果,或者 ctrl + e) html缩写 输入 !后 按下 ctrl + e : 结果 <!DOCTYPE html><html lang=&qu ...

随机推荐

  1. 北风设计模式课程---开放封闭原则(Open Closed Principle)

    北风设计模式课程---开放封闭原则(Open Closed Principle) 一.总结 一句话总结: 抽象是开放封闭原则的关键. 1."所有的成员变量都应该设置为私有(Private)& ...

  2. MySQL多表查询合并结果union all,内连接查询

    MySQL多表查询合并结果和内连接查询 1.使用union和union all合并两个查询结果:select 字段名 from tablename1 union select 字段名 from tab ...

  3. 【初识TypeScript】 配置环境后运行Hello World编译报错.

    第一次接触TypeScript,配置好环境后, 发现连编写个最基本的Hello World都报错,代码如下: const hello:string = "Hello World!" ...

  4. python json字符串中有int类型数字(不带引号)

    def jsonfy(s:str)->object: obj = eval(s, type('js', (dict,), dict(__getitem__=lambda s, n: n))()) ...

  5. 如何把一些字符串用dict组织成json格式?(小算法)

    说明: 1. 数据库中的一条记录取出来是这样的(直接复制):'value1','value2' ,'value3' 2. 我希望使用的数据格式是:{key1:'value1',key2:'value2 ...

  6. 006-spring-data-elasticsearch 3.0.0.0使用【四】-spring-data之Elasticsearch Repositories

    续 二.Elasticsearch Repositories 2.1.简介 2.1.1.Spring命名空间 Spring Data Elasticsearch模块包含一个允许定义存储库bean的自定 ...

  7. 003-js-MD5

    源码 /* global define */ ;(function ($) { 'use strict' /* * Add integers, wrapping at 2^32. This uses ...

  8. 阶段1 语言基础+高级_1-3-Java语言高级_06-File类与IO流_09 序列化流_2_对象的序列化流_ObjectOutputStream

    创建person对象.生成构造方法全参和无参.getter和setter 抛出异常:没有序列化异常 接口的源码 啥都没有.就起到一个标记的作用 用二进制存的

  9. 《图解设计模式》读书笔记8-1 Observer模式

    目录 示例程序 程序类图 程序 角色和类图 角色 类图 思路拓展 可复用性 Observer的顺序 MVC模式 Observer模式 Observer模式即观察者模式,该模式中,被观察者的状态发生变化 ...

  10. Nginx主要功能及使用

    Nginx配置详解   序言 Nginx是lgor Sysoev为俄罗斯访问量第二的rambler.ru站点设计开发的.从2004年发布至今,凭借开源的力量,已经接近成熟与完善. Nginx功能丰富, ...