Sublime text3 013 emmet 插件

Sublime text3 013 emmet 插件
------------------------------------------------------------------------------
如果有什么不明白的，加QQ群：186970878

经常会有错字 或 语句不通的，欢迎联系本人，方便快速修正，也方便后来者阅读。

联系本人QQ： 2071551682
------------------------------------------------------------------------------
----------------- Emmet 插件用处 ------------

新建一个 html 文件 ，输入 ! , html:5  ,  <html   前面三种代码任意一个， 按 Tab 键 ( Ctrl + E )  ，自动补全。

------------- 默认生成代码 --------------

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Document</title>
</head>
<body>
 
</body>
</html>

------------- 以上 默认生成代码 --------------

----------------- Emmet简介 ------------------

　　Emmet (前身是 Zen Coding)是一个前端开发不可缺少的插件，它让编写 HTML 和 CSS 代码变得简单，节省大量时间。Emmet可使开发者用缩写形式书写代码，再用“扩展”功能自动将代码扩展至完整样式。

　　早在2009年，Zen Coding作为具有革命性的 HTML 和 CSS 代码编辑插件一经问世，直到现在帮助了无数的开发者，减少他们的时间，使得编写代码变得简便有趣。现在，Emmet已经超越了Zen Coding到达了更高层次，普适性的功能将给更多的开发者带来便利。

　　插件下载：https://github.com/sergeche/emmet-sublime

----------------- emmet 插件安装 ------------------------------

Installed Packages  执行完成后

菜单 > Tools > Command Palette (命令面板)   Ctr + Shift + P
Menu > 工具  > 命令面板

菜单 > 首选项       > Package Control
Menu > Preferences  > Package Control              (两处菜单都可以打开这个 插件面板)

如果命令面板里有 package control: 这样的字样，就代表安装完成。

然后输入 Install Package，选择第一个 Package Control: Install Package

在出现的 插件面板 输入 emme 安装这个 插件 Emmet。

----------------------------------------------------------------------------------
 去菜单中找一下安装的插件 Preferences > Package Settings > 有这个菜单，就说明已经安装成功

这回再去安装 Install Package , 查找 emmet 找不到，也说明已经安装。

----------------------------------------------------------------------------------
------------  ************  下面是 安装成功提示 *************  ------------

Emmet
-----

Thank you for installing Emmet -- a toolkit that can greatly improve your workflow. Note that this plugin automatically downloads and installs PyV8 binary (see status bar message).
 
  ******************************
  Please restart editor
  to finish installation process
  after PyV8 was downloaded.
  ******************************
 
  Tab key handler
  ==========================
 
  By default, Emmet allows you to expand abbreviations with Tab key in HTML, XML, HAML and CSS/SASS/LESS/Stylus documents. As a side effect, you can’t use some of your ST2 snippets.
 
  Please read https://github.com/sergeche/emmet-sublime#tab-key-handler about how Tab handler works and how to tweak its behavior to match your needs.
 
  Enter key
  ==========================
 
  In HTML and XML documents, Emmet overrides Enter key to insert formatted line breaks between opening and closing tags. In some cases it will break character input (for example, in Japanese language).
 
  To disable Enter key handler, simply add the following option in your user‘s Preferences file:
 
  "disable_formatted_linebreak": true
 
  Actions shortcuts
  ==========================
 
  Emmet has a number of actions with keyboard shortcuts that may override ones you‘re using commonly (for example, Ctrl-E or Ctrl-Down). Please read the project main page to get list of available actions and keyboard shortcuts and how to disable them:
  https://github.com/sergeche/emmet-sublime
 
  Documentation and examples:
  http://emmet.io
 
  ------------------------------
  Follow me on Twitter: @emmetio
  ------------------------------

------------  ************  上面是 安装成功提示 *************  ------------

成功安装后，多一个菜单项：

preferences > package setting > Emmet >
首选项      > package setting > Emmet >

---------------   卸载插件(也可以用这个方法查看已经安装的包。) --------------------

菜单 > Tools > Command Palette    Ctr + Shift + P
  Menu > 工具  > 命令面板

Menu > Preferences  > Package Control
菜单 > 首选项       > Package Control

2 卸载插件选项：
输入 remove package
package control: Remove Package

3 在控制台中可以看到已经安装好的 插件包。点击 emmet .

----------------  离线（ 手动 ）安装方法 -------------

------------------------------------------------------

下载地址：
https://github.com/sergeche/emmet-sublime#readme

Clone or download >  Download ZIP

https://github.com/sergeche/emmet-sublime.git

得到文件： emmet-sublime-master.zip

Menu  》 Preferences 》 Broswe Packages

菜单  》 首选项      》 浏览插件目录

默认路径位置：
C:\Users\Administrator\AppData\Roaming\Sublime Text 3\Packages

emmet 解压后的文件直接放在这个位置 ，文件夹名：emmet-sublime-master

放入的文件夹名称： Packages

自动生成一个目录：  PyV8

注意：

这个下载的文件不能放到 Installed Packages 这个文件中

----  Emmet 插件 编辑 html html5 css  不用另安装插件  -----

------------------------------------------------------------------------------
如果有什么不明白的，加QQ群：186970878

经常会有错字 或 语句不通的，欢迎联系本人，方便快速修正，也方便后来者阅读。

联系本人QQ： 2071551682
------------------------------------------------------------------------------

原文地址：https://www.cnblogs.com/qy123/p/9190825.html

时间： 2024-08-05 20:56:51

Sublime text3 013 emmet 插件的相关文章

sublime text3安装emmet插件

sublime text3如果不能ctrl+p去安装emmet插件, 就安装下面步骤操作: ①关闭Sublime Text 3 ②下载sublime_package_control-master.zip 下载地址:http://files.cnblogs.com/tinyphp/sublime_package_control-master.zip 解压命名文件夹为Package Control   (注意大小写) ③重新启动Sublime Text 3,在选择菜单里面选择:Preference-

sublime text3中emmet插件的使用

首先,想要快速编码需 要在编辑器中安装常用插件,下面是emmet插件的使用: html5文档结构的生成方式: 1).!+tab键 2).html:5 +tab键 头部head中meta字符集的生成: 1). meta:utf + tab键  生成:<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> 2).meta:vp +tab键  生成 : <meta name=&

sublime text3安装js插件

今天安装Sublime Text3的js插件,在网上查了很多资料,为了方便以后看,写一个安装插件的总结和方法. 要安装js相关的插件,就要先安装一个Package Control(插件管理器)的插件,通过这个插件再去安装想要的js相关插件. 1.安装Package Control 安装插件首先需要一个叫Package Control(插件管理器)的插件,Package Control本身是一个为了方便管理插件的插件. 插件管理器Package Control的作用是对插件的浏览.安装和卸载插件.

sublime Text3 前端常用插件

sublime Text3 前端常用插件 - File Switching (文件切换) --- Sublime Text提供了一个非常快速的方式来打开新的文件.只要按下Ctrl+ P并开始输入你想要打开的文件的名称.一旦找到文件,只需按enter键,就可以开始直接输入到该文件了! - Goto Symbols (跳转标记) --- 当你编辑一个大文件时,文件中有一堆方法,按`Ctrl + R将其全部列出来,使他们更容易找到.开始尝试的输入你想要的,然后按Enter 就可以快速跳转这个方法了.

Sublime Text3安装SublimeREPL插件以及快捷键设置

SublimeREPL是Sublime Text的一个插件,它除了可以使你在ST中运行解释器(REPL),还有对Python语言的特别支持,包括在本地/远程(远程仅在linux/osx平台可用)virtualenv中启动Python,快速运行选中的代码或者启动PDB等. 本文介绍在windows下Sublime Text3安装SublimeREPL插件以及快捷键设置等. ------------- 1.Package Control *我是建议使用的是直接内置了Package Control的S

Sublime text3 015 emmet 快捷输入

Sublime text3 015 emmet 快捷输入------------------------------------------------------------------------------如果有什么不明白的,加QQ群:186970878 经常会有错字 或 语句不通的,欢迎联系本人,方便快速修正,也方便后来者阅读. 联系本人QQ: 2071551682--------------------------------------------------------------

sublime text3 增加emmett插件

本内容基于Windows环境)一.已安装有Sublime Text3 二.安装Package Control    安装这个后,可以在线安装所需的插件    方法1.Ctrl+~打开控制台,在控制台输入如下的Python命令import  urllib.request,os;pf='Package Control.sublime-package';ipp=sublime.installed_packages_path();urllib.request.install_opener(urllib.

sublime text3的一些插件安装方法和使用

sublime text部分插件使用方法在线安装package Control的方法:    ctrl+~ 输入如下代码:        import urllib2,os; pf='Package Control.sublime-package';        ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None;         urllib2.ins

使用sublime text3手动安装插件

众所周知,由于网络问题,使用install package可能会连不上服务器,这时候就不得不手动安装插件了. 其实sublime安装插件的原理就是当你搜索一个插件并安装的时候,它回去github找到这个插件的仓库,然后把它下载下来并解压缩,放到自己的packages目录里. 明白这个原理后,我们自己就可以去github搜索并下载自己需要的插件. 下面以安装emmet插件为例: 首先访问github:https://github.com/ 然后在搜索框中输入emmet,按星最多的排序. 进入这个仓