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

现在它改名为了Emmet,并且搭建了一个新的网站:docs.emmet.io。

和一般的编辑器中使用的“代码片段”概念不太一样,Emmet使用动态的语法来生成代码,这意味着你不需要自己去编辑并创建固定的代码片段。 大大的提高了代码编写效果,这一点似的Zen coding非常的流行。

例如,输入如下内容:

ul#nav>li.item$*4>a{Item $}

Emmet会帮助你生成如下的代码片段:

<ul id="nav">
<li class="item1"><a href="">Item 1</a></li>
<li class="item2"><a href="">Item 2</a></li>
<li class="item3"><a href="">Item 3</a></li>
<li class="item4"><a href="">Item 4</a></li>
</ul>

Emmet 作为插件可以支持如下的编辑器:

  • Eclipse/Aptana
  • Sublime Text 2
  • TextMate 1.x
  • Coda 1.6 and 2.x
  • Espresso
  • Komodo Edit/IDE
  • Notepad++
  • PSPad
  • <textarea>
  • CodeMirror2

个人比较喜欢使用Sublime Text 2,整合了Emmet会让你的开发如虎添翼,相信作为web开发“猿”的你肯定会喜欢!

Web开发人员必备工具-Emmet (Zen Coding)的更多相关文章

  1. 前端必备工具-Emmet (Zen Coding)

    Emmet 可以快速的编写 HTML 和 CSS,输入指令如: ul#nav>li*4>a*4 敲击一下TAB 键,就会输出: <ul id="nav"> ...

  2. Web 开发人员必备的随机 JSON 数据生成工具

    在 Web 开发中,经常会需要一些测试数据来测试接口或者功能时候正确.JSON Generator 就是这样一款生成随机 JSON 数据的在线工具,Web 开发人员必备,记得收藏和分享啊. 您可能感兴 ...

  3. Web 开发人员必备的12款 Chrome 扩展程序

    之前已经分享过一些帮助 Web 开发人员和设计师的 Chrome 扩展,这次我们继续展示一组很有用的 Chrome 应用程序.这些免费的 Chrome 应用程序可以简化您的工作流程,为了加快您的工作流 ...

  4. .Net开发人员必备工具下载

    .Net开发人员必备工具下载   本人亲测下载地址: Win8.1破解工具下载: http://pan.baidu.com/s/1eQf2UiQ 可激活版本 Windows Vista Busines ...

  5. 【特别推荐】Web 开发人员必备的经典 HTML5 教程

    对于我来说,Web 前端开发是最酷的职业之一,因为你可以用新的技术发挥,创造出一些惊人的东西.唯一的问题是,你需要跟上这个领域的发展脚步,因此,你必须不断的学习,不断的前进.本文将分享能够帮助您快速掌 ...

  6. Android开发工具综述,开发人员必备工具

    安卓开发工具汇总.开发者必备.安卓开发过程中须要用到各种工具,作为一名安卓开发者,有木有感到亚历山大,那么多工具! 今天给大家汇总了一下安卓开发工具,安卓开发者必备利器. 1.Draw 9-Patch ...

  7. 开发人员必备工具 —— JMeter 压测

    在接口开发完以后,开发人员应该学会对自己的接口先进行压测一下,虽然压测的结果并不一定准确,也不能完全反映真实情况,但是如果有问题的话多少是可以看出的,而且也可以及早做优化,做到心里有底.否则,等测试进 ...

  8. 值得 Web 开发人员收藏的20个 HTML5 实例教程

    当开始学习如何创建 Web 应用程序或网站的时候,最流行的建议之一就是阅读教程,并付诸实践.也有大量的 Web 开发的书,但光有理论没有实际行动是无用的.现在由于网络的发展,我们有很多的工具可以用于创 ...

  9. 值得 Web 开发人员收藏的16款 HTML5 工具

    HTML5 正在迅速改变创建和管理网站的方式.HTML5 在不同的领域让网页设计更强大的.快速,安全,响应式,互动和美丽,这些优点吸引更多的 Web 开发人员使用 HTML5 开发各种网站和应用程序. ...

随机推荐

  1. 【MongoDb--初入江湖】windows下安装MongoDb

    一.windows下安装MongoDb http://docs.mongodb.org/manual/tutorial/install-mongodb-on-windows/

  2. 【AutoMapper】实体类间自动实现映射关系,及其转换。

    官方项目下载: http://automapper.codeplex.com/ 博文 http://www.iteye.com/blogs/tag/AutoMapper 图解: 第一步:创建映射Map ...

  3. POJ2996Help Me with the Game

    http://poj.org/problem?id=2996 又是一个大模拟题,表示做模拟题做的恶心,这个题主要是对数据的处理,从表格中将数据取出来再进行处理即可. 主要注意的点就是:1.KQRBN五 ...

  4. C Primer Plus 第3章 数据和C 编程练习

    1. /* 整数上溢 */ #include <stdio.h> int main(void) { ; unsigned ; /* 无符号整数j像一个汽车里程指示表(形容的太好了,可参考& ...

  5. [hackerrank]Even Odd Query

    https://www.hackerrank.com/contests/w5/challenges 简单题,注意整数的0次方是1,奇数. #include <iostream> #incl ...

  6. CentOS 7.0安装Nvidia驱动

    entOS 7.0 Nvidia显卡安装步骤: 1 在英伟达官网下载相应驱动 搜索出相应的驱动后,不要直接点,而是右健,Save Link as... 否则,会出现下载半天没动静的情况. 存放的路径上 ...

  7. Android 虚线分割Shape

    <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http: ...

  8. Java API —— 泛型

    1.泛型概述及使用 JDK1.5以后出现的机制 泛型是一种特殊的类型,它把指定类型的工作推迟到客户端代码声明并实例化类或方法的时候进行.也被称为参数化类型,可以把类型当作参数一样传递过来,在传递过来之 ...

  9. Java类型

    Java类型    本地类型         描述boolean    jboolean       C/C++8位整型byte       jbyte          C/C++带符号的8位整型c ...

  10. RegexOne

    http://regexone.com/ http://regexone.com/lesson/optional_characters? http://regexone.com/lesson/capt ...