安装 Emmet 也有快速生成文件头的功能啊，而且更强大啊
输入下边加粗的缩写，然后Tab，就OK了啊
http://docs.emmet.io/cheat-sheet/

html:4t

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<htmllang="${lang}">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=${charset}">
<title>Document</title>
</head>
<body>
${child}
</body>
</html>

html:4s

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<htmllang="${lang}">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=${charset}">
<title>Document</title>
</head>
<body>
${child}
</body>
</html>

html:xt

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml"xml:lang="${lang}">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=${charset}"/>
<title></title>
</head>
<body>
${child}
</body>
</html>

html:xs

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml"xml:lang="${lang}">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=${charset}"/>
<title>Document</title>
</head>
<body>
${child}
</body>
</html>

html:xxs

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml"xml:lang="${lang}">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=${charset}"/>
<title>Document</title>
</head>
<body>
${child}
</body>
</html>

html:5

<!doctype html>
<htmllang="${lang}">
<head>
<metacharset="${charset}">
<title>Document</title>
</head>
<body>
${child}
</body>
</html>

例如，输入如下内容：

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

原文来自：http://blog.sina.com.cn/s/blog_711c3a9e0101jqep.html

非常强大的前端插件：emmet的更多相关文章

  1. ATOM基础教程一使用前端插件emmet(16)

    emmet简介 http://blog.csdn.net/zsl10/article/details/51956791 emmet的前身是Zen coding,从事Web前端开发的工程师对该插件并不陌 ...

  2. 前端插件Emmet

    Sublime text安装 步骤一:首先你需要为sublime text安装Package Control组件: 按Ctrl+`调出sublime text的console 粘贴以下代码到底部命令行 ...

  3. 前端html、CSS快速编写代码插件-Emmet使用方法技巧详解

    前端html.CSS快速编写代码插件-Emmet使用方法技巧详解   Emmet的前身是大名鼎鼎的Zen coding,如果你从事Web前端开发的话,对该插件一定不会陌生.它使用仿CSS选择器的语法来 ...

  4. sublime text3 前端插件介绍

    Emmet插件 Emmet插件可以说是使用Sublime Text进行前端开发必不可少的插件 它让编写HTML代码变得极其简单高效 基本用法:输入标签简写形式,然后按Tab键 关于Emmet的更多介绍 ...

  5. Web 前端利器Emmet 的HTML用法总结

    在tutsplus那里看到一篇文章介绍Emmet 的用法,形象的gif图片一目了然,本来想翻译过来的(虽然翻译用法倒不是很难),但搜索发现已经有国人翻译过了,遂直接拿来转载在这里. Emmet 简介 ...

  6. VScode前端插件推荐

    工欲善其事,必先利其器,安利一波前端插件. Chinese (Simplified) Language Pack for Visual Studio CodeVScode汉化插件 Beautify代码 ...

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

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

  8. 前端插件之Bootstrap Dual Listbox使用

    工欲善其事,必先利其器 对于很多非专业前端开发来说写页面是非常痛苦的,借助框架或插件往往能够达到事半功倍的效果,本系列文章会介绍我在运维系统开发过程中用到的那些顺手的前端插件,如果你是想写XX管理系统 ...

  9. 前端插件之Datatables使用--下篇

    工欲善其事,必先利其器 本系列文章介绍我在运维系统开发过程中用到的那些顺手的前端插件,上一篇文章介绍了Datatables插件的基本使用,这一篇文章作为上一篇的延续,会介绍Databases的一些高级 ...

随机推荐

  1. 单字节的FIFO缓存（30天自制操作系统--读书笔记）

    从今天起,写一些读书笔记.最近几个月都在看<30天自制操作系统这本书>,书虽说看的是电子书,但可以花钱买的正版书,既然花费了金钱,就总得有些收获. 任何人都不能总是固步自封,想要进步就得学 ...

  2. ubuntu gcc低版本过低引起错误

    错误内容: 正在读取软件包列表... 完成正在分析软件包的依赖关系树 正在读取状态信息... 完成 您可能需要运行“apt-get -f install”来纠正下列错误:下列软件包有未满足的依赖关系: ...

  3. 一个简单的servlet

    1.创建一个自己的servlet文件,继承HttpServlet MyServlet.java package com.jmu.ccjoin.controller; import java.io.IO ...

  4. MYSQL进阶学习笔记十二：MySQL 表分区！（视频序号：进阶_29，30)

    知识点十三:MySQL 表的分区(29) 一.什么要采用分区: 分区的定义: 当数据量过大的时候(通常是指百万级或千万级数据的时候),这时候需要将一张表划分几张表存储.一些查询可以得到极大的优化,这主 ...

  5. AJAX 用户验证方法

    JSP <td width="10%" class="main_matter_td">真实姓名</td> <td width=&q ...

  6. php中自运算++ 或-- 的总结

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

  7. codeforces 505C C. Mr. Kitayuta, the Treasure Hunter(dp)

    题目链接: C. Mr. Kitayuta, the Treasure Hunter time limit per test 1 second memory limit per test 256 me ...

  8. [Selenium] 配置 Internet Explorer Driver 的注意事项

    1)请确保 IEDriverServer 的可执行文件在系统环境变量PATH 中 2)在IE7 和以上版本的 Internet Explorer 上,必须确保保护模式的正确配置.设置方式为 Tools ...

  9. GCD的使用（1）使用GCD保护property

    作为一个iOS开发者,必须要熟练使用GCD,本文是站在实际应用的角度总结GCD的用法之一: 使用barrier保护property.在多线程环境下,如果有多个线程要执行同一份代码,那么有时会出现问题, ...

  10. BZOJ_2253_[2010 Beijing wc]纸箱堆叠 _CDQ分治+树状数组

    BZOJ_2253_[2010 Beijing wc]纸箱堆叠 _CDQ分治+树状数组 Description P 工厂是一个生产纸箱的工厂.纸箱生产线在人工输入三个参数 n p a , , 之后, ...