Sublime Text 插件之:Emmet,旧版称:ex-Zen Coding 更名之后增加了CSS3和HTML5许多新特性。项目地址也从 code.google 移 github.

安装:

  • Package 方式就不再赘述了(如何安装请移步:安装package
  • 安装了 控制包后搜索 Emmet 即可
手动安装
  1. 下载 Emmet Sublime ,的github项目地址 emmet;你可以 clone 或者直接 下载
  2. 文件夹手动安装 ,下载完成后打开 Preferences > Browse Packages 直接放入文件夹 emmet-sublime-master,重启 ST 菜单栏 Preferences > Package Settings > emmet 已经出现,没有?那就没办法了……
  3. 下载安装 PyV8 Binaries ,注意你的操作系统,由于 git下载源不稳定 楼主特地整理了各个操作系统的 V8 : 移步 百度网盘

安装方式 同第2步 放入文件夹 PyV8 选择自己操作系统相对应的 V8 再放入 PyV8 文件夹中 比如 pyv8-win64 ,然后 重启下 ST

github V8项目最新版下载地址: PyV8 download

4.尝试一下 html:5 按 Ctrl+e 看看发生了什么(当然Tab也可以)

在敲一个 div.test.wrap>ul#nav>li.item$*4>a{Item $} 开心吧!难过?那就没办法了~

  • 注:在未装 Emmet 前 ST 支持

比如: div.wrap 按 Tab 后输出

<div class="wrap"></div>

但是: div.wrap.test 按 Tab 后输出

div<wrap>test</wrap>

安装成功 Emmet 后输出

<div class="wrap test"></div>

那么 div.test.wrap>ul#nav>li.item$*4>a{Item $} 还需要解释么,和css的写法基本类似吧, *4 自然是重复 4 次, {Item $} 表示 a 标签中的 内容

具体可以参考 Emmet 官网

E

元素名(div、p);

E#id

带Id的元素(div#content、p#intro、span#error);

E.class

带class的的元素(div.header、p.error),id和class可以连着写,div#content.column

E>N

子元素(div>p、div#footer>p>span)

EN

多项元素(ul#nav>li
5>a)

E+N

多项元素

E$*N

带序号的元素

Zen Coding && Emmet-Sublime 安装的更多相关文章

  1. Notepad++ 安装 Zen Coding / Emmet 插件

    Zen Coding 插件 ============== 下载: Zen.Coding-Notepad++.v0.7.zip ==Installation== 1. Copy contents of ...

  2. vim 中 也可以 直接安装 emmet 直接使用zen coding 生成 l指定个数的 lorem ipsum文字.

    超链接的写法: 当作为链接的文字, 比较长时, 整个作为链接 就显得不是 很适合. 可以取其中的某一个单词 作为 超链接的 关键字:如: click here to continue emmet中如何 ...

  3. Sublime Text 2+Zen Coding

    自己长期使用editplus做代码编辑,使用过DW,还是习惯前者的使用环境.好友推荐,试试新的编码工具——Sublime Text 2.在代码制作过程中,最主要的是1)快速复制的模式化工作  2)零碎 ...

  4. Sublime Text2安装emmet(原名Zen Coding)总结

    首先,安装好Sublime( 我用的是版本号2),之后注冊好.Sublime Text2.0.2注冊码:http://xionggang163.blog.163.com/blog/static/376 ...

  5. sublime + emmet(Zen Coding)

    今天接触sublime这个编辑器,一下子就喜欢上它了,以前我一直使用NOTEPAD++,果断换上sublime玩玩,呵呵 编辑功能啥的没话,作为前端开发的话,和emmet(原名叫Zen Coding) ...

  6. 使用Emmet(前身Zen Coding)加速Web前端开发

    Emmet插件以前被称作为Zen Coding,是一个文本编辑器的插件,它可以帮助您快速编写HTML和CSS代码,从而加速Web前端开发.早在2009年,Sergey Chikuyonok写过一篇文章 ...

  7. Sublime Text 3 Emmet插件安装

    一.手动安装:   1. Emmet (ex-Zen Coding) for Sublime Text  http://emmet.io (1) 下载:https://github.com/serge ...

  8. 再说vundle: 完全vim字符编程的四个必须插件 - zen coding 和emmet插件的使用

    一个常识: 基本上vim插件的配置文集都是放在对应插件目录 的/autoload/ plugin_name.vim 文件中的 有四个必要/必须的插件,实现vim完全的字符界面的编程: NERDTree ...

  9. sublime 插件zen coding

    sublime的插件Zen Coding是一个编写html的神器,现在已经更名为Emmet了. 在sublime中的package需要搜索的是Emmet 相关网站: 官网 Zen Coding: 一种 ...

  10. Web开发人员必备工具-Emmet (Zen Coding)

    如果你从事前端开发或者web开发的话,一定听说过Zen coding - 一种快速编写HTML/CSS代码的方法.它使用仿CSS选择器的语法来快速开发HTML和CSS - 由Sergey Chikuy ...

随机推荐

  1. SQL:登录、连接数据库基本操作

    使用MySQL 登录.连接数据库 win+R打开控制台,cmd进入控制台,输入mysql -u root -p,后输入密码,进入数据库: 首先可以查看原有的数据库,输入 show databases; ...

  2. Windows系统常见问题

    1.Windows自动更新灰色不能修改HKEY_LOCAL_MACHINE/Software/Policies/Microsoft/WindowsWindowsUpdate的资料夹,在WindowsU ...

  3. HTML学习日记之元信息meta标记

    所谓meta标记就是用来描述一个HTML网页文档的属性,也称为元信息,这些信息并不会显示在浏览器的页面中,例如作者.日期和时间.网页描述.页面刷新等. 基本语法: <meta name = &q ...

  4. 使用PHPExcel 读取 表格数据, 发现中文全变成 FALSE??

    出现这样的情况, 你可以看看你的表格是不是 CSV 格式的. 如果是, 那就赶紧另保存为 xls.xlsx 等格式的表格 . 因为 PHPExcel 对 Csv 的表格不感冒....

  5. HaoheDI让ETL变得简单

    HaoheDI(昊合数据整合平台)http://www.haohedi.com,产品基于BS架构,开发运维均极为简单,可快速搭建ETL平台,广泛支持各种数据库.文本文件.SAP和Hadoop,开发数据 ...

  6. web頁面優化以及SEO

    轉載:https://blog.csdn.net/xustart7720/article/details/79960591 浏览器访问优化浏览器请求处理流程如下图: Etag:實體標籤.ETag是HT ...

  7. Python 爬虫 招聘信息并存入数据库

    新学习了selenium,啪一下腾讯招聘 from lxml import etree from selenium import webdriver import pymysql def Geturl ...

  8. vue实现图片路径传送

    <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"& ...

  9. HDOJ:1533-Going Home(最小费用流)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1533 解题心得: 第一次写最小费用流的题,去hdoj上找了一个入门级题目,建图比较简单,用了spfa和 ...

  10. 初识Trie_对Trie的一些认识

    Trie,之前觉得一个听起来很diao的数据结构,学了发现其实是一个挺简单的数据结构. 在计算机科学中,trie,又称前缀树或字典树,是一种有序树,用于保存关联数组,其中的键通常是字符串.与二叉查找树 ...