1、Package Control

  1. 按Ctrl+~调出console（或者view>show console）
  2. 粘贴以下代码到底部命令行并回车：
  3. import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read())
  4. 重启Sublime Text 3。
  5. 如果在Perferences->package settings中看到package control这一项，则安装成功。

2、js format　一个JS代码格式化插件。 

　　1. 安装package control 菜单 View - Show Console 或者 ctrl + ~ 快捷键，调出 console。将以下 Python 代码粘贴进去并 enter 执行，不出意外即完成安装。以下提供 　　ST3 的安装代码：　　　

import urllib.reques,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path();

urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) );

open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read())

　　2.打开菜单->首选项->插件控制，输入 install package

　　3.等待程序进入插件管理功能，再输入插件名称：JS Format (默认快捷键Ctrl+Alt+F)

3、ConvertToUTF8　

  1. 按Ctrl+~调出console（或者view>show console）
  2. 粘贴以下代码到底部命令行并回车：
  3. import urllib.request,os,hashlib; h = '7183a2d3e96f11eeadd761d777e62404e330c659d4bb41d3bdf022e94cab3cd0'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)
  4. 重启sublime text3。
  5. 按windows：Ctrl+Shift+P;mac：command+shift+P打开命令行，输入Install Package，回车，然后继续输入ConvertToUTF8，回车。

4、emmet HTML/CSS代码快速编写神器

　　1、在前面已安装的Package Control的基础之上，首先

　　　　

点击菜单Preference-->Package Control

点击Install Package

　　 　

等待几秒后再弹出如下内容，敲键盘emmet，选择如下：

　　　

在 Emmet 安装完成后，会显示如下屏幕：然后会自动安装PyV8，安装完成，重启 Sublime Text 3。

　　

5、emmet的基本使用方法

　　HTML文档需要包含一些固定的标签，比如<html>、<head>、<body>等，现在你只需要1秒钟就可以输入这些标签。比如输入“!”或“html:5”，然后按Tab键： 
　　

  轻松添加类、id、文本和属性 

　　连续输入元素名称和ID，Emmet会自动为你补全，比如输入p#foo： 
　　
　　连续输入类和id，比如p.bar#foo，会自动生成： 　　

<p class="bar" id="foo"></p>

　　下面来看看如何定义HTML元素的内容和属性。你可以通过输入h1{foo}和a[href=#]，就可以自动生成如下代码：

01.<h1>foo</h1>

02.<a href="#"></a>

　　

　　 嵌套 
　　 现在你只需要1行代码就可以实现标签的嵌套。

  • >：子元素符号，表示嵌套的元素
  • +：同级标签符号
  • ^：可以使该符号前的标签提升一行

  分组 
　　　你可以通过嵌套和括号来快速生成一些代码块，比如输入(.foo>h1)+(.bar>h2)，会自动生成如下代码：　　

01.<div class="foo">

02.  <h1></h1>

03.</div>

04.<div class="bar">

05.  <h2></h2>

06.</div>

　　

　　定义多个元素 
　　要定义多个元素，可以使用*符号。比如，ul>li*3可以生成如下代码：　

01.<ul>

02.  <li></li>

03.  <li></li>

04.  <li></li>

05.</ul>

　　

　 定义多个带属性的元素 
　  如果输入
ul>li.item$*3，将会生成如下代码：

01.<ul>

02.  <li class="item1"></li>

03.  <li class="item2"></li>

04.  <li class="item3"></li>

05.</ul>

　　

　　css缩写值 
　　比如要定义元素的宽度，只需输入w100，即可生成 
　　

sublime text3 常用插件安装的更多相关文章

  1. Sublime text3 常用插件 安装

    1 安装插件前的准备工作 首先确保你的Sublime Text3编辑器为官方版(非破解版),建议下载官网的便携版本(好处多多). 然后安装插件管理工具(Package Control) 1.1 打开S ...

  2. 前端神器Sublime Text3 常用插件&常用快捷键

    Sublime Text3常用插件 使用Package Control组件安装 也可以安装package control组件,然后直接在线安装: 按Ctrl+`调出console(注:安装有QQ输入法 ...

  3. Sublime Text3—常用插件Emmet

    摘要 安装请看上一篇Sublime Text-安装,和sublime自带快捷键一起用,写html简直快的飞起. 下面整理的是常用的,完整的可看emmet官方文档. 一.生成标签 1.快速生成文档结构 ...

  4. SubLime Text3 常用插件总结

    近来开始恶补前端知识,在一定的技能基础上,逐渐开始进阶的学习和使用.因此在这里罗列下,SubLime Text3 常用插件: 1.Emmet 提高HTML & CSS3编写速度. 2.Them ...

  5. 前端与php的sublime text3常用插件

    sublime text各种版本下载:http://sublimetext.iaixue.com/dl/ 1.安装Package Control 快捷键: ctrl+`     粘贴内容后Enter: ...

  6. sublime text3及插件安装过程

    本人安装的是sublime text3 1.安装 这个过程下一步下一步即可 2.激活 在help菜单中选择输入验证码,例如以下整个都是: ----- BEGIN LICENSE ----- Andre ...

  7. sublime text 常用插件安装

    一.安装方法 ctrl+ship+p —— 在弹出的地方输入 pci (package control: install pagckage)—— 再输入 要安装的包名 二.一步过慢或失败解决: 原因: ...

  8. Sublime Text3常用插件以及安装方法(实用)

    Package Control组件在线安装 按Ctrl+`调出console(注:避免热键冲突) 粘贴以下代码到命令行并回车: import urllib.request,os; pf = 'Pack ...

  9. Sublime Text3常用插件以及安装方法(实用)【转载】

    https://www.cnblogs.com/liuchaoH/p/6370008.html Package Control组件在线安装 按Ctrl+`调出console(注:避免热键冲突) 粘贴以 ...

随机推荐

  1. [LeetCode] Best Time to Buy and Sell Stock with Cooldown 买股票的最佳时间含冷冻期

    Say you have an array for which the ith element is the price of a given stock on day i. Design an al ...

  2. [LeetCode] Excel Sheet Column Title 求Excel表列名称

    Given a positive integer, return its corresponding column title as appear in an Excel sheet. For exa ...

  3. .NET跨平台之旅：增加文件日志功能遇到的挫折

    在将我们的ASP.NET 5示例站点(about.cnblogs.com)升级至ASP.NET 5 RC1的时候,我们增加了控制台日志功能. 在ASP.NET 5添加日志功能很简单,只需在projec ...

  4. 语义网 （Semantic Web）和 web 3.0

    语义网=有意义的网络. "如果说 HTML 和 WEB 将整个在线文档变成了一本巨大的书,那么 RDF, schema, 和 inference languages 将会使世界上所有的数据变 ...

  5. springmvc：jsp fmt标签格式化Date时间，格式化后可以用于页面展示

    java后台的对象时间参数是date类型,在前端想格式化,又是放在input输入框中的 先引入jstl标签库 <%@taglib uri="http://java.sun.com/js ...

  6. 【转】封装原生JS实现Ajax

    function createXHR() { if (window.XMLHttpRequest) { //IE7+.Firefox.Opera.Chrome 和Safari return new X ...

  7. javaScirpt事件详解-原生事件基础（一）

    事件 JavaScript与HTML之间的交互是通过事件实现的.事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间,通过监听特定事件的发生,你能响应相关的操作.图片引用:UI Events 事件流 ...

  8. ERwin创建逻辑模型

    1.逻辑实体添加非主键属性的三种的方式 属性1:在图中直接创建 属性2:在模型导航器中创建 属性3:在属性对话框中创建 2.实体显示选项(Entity Display) Rolename/Attrib ...

  9. Atomikos实现多数据源的事物管理

    之前试过使用Spring动态切换数据库,通过继承AbstractRoutingDataSource重写determineCurrentLookupKey()方法,来决定使用那个数据库.在开启事务之前, ...

  10. SQL注入判断方法总结（持续更新）

    http://e.com/1.php?id=1 http://e.com/1.php?id=1-- sd http://e.com/1.php?id=aaa http://e.com/1.php?id ...