For example we want to generate the code like this:

    <a href="#tab1">Tab 1</a><a href="#tab2">Tab 2</a><a href="#tab3">Tab 3</a>
<div id="tab1" class="tab">
<h1>Tab 1 Content</h1>
</div>
<div id="tab2" class="tab">
<h1>Tab 2 Content</h1>
</div>
<div id="tab3" class="tab">
<h1>Tab 3 Content</h1>
</div>

So it is three div, has a id called tab1,2,3 and a class tab. inside the div, has h1 with the content.

We can do:

a[href=#tab$]{Tab $}*3

(#tab$.tab>h1{Tab $ Content})*3

[]: attr

#tab: id--> tab

#tab$: id--> tab with increase interger

.tab: class tab

>: child node

{}: content

[HTML5] Emmet的更多相关文章

  1. Html5 学习笔记 Sublime text3 和 Emmet 插件

    下载地址 :https://pan.baidu.com/s/1MpkaYdAcZd6RmPpmvOdK7w Emmet 压缩包 并且解压: 安装 Sublime Text 3, 选择首选项 浏览插件 ...

  2. emmet的使用

    http://blog.wpjam.com/m/emmet-grammar/ 使用 Emmet 生成 HTML 的语法详解 开源程序 浏览:21537 2013年05月09日 文章目录[隐藏] 生成 ...

  3. Emmet使用

    emmet官方文档 [翻译]Emmet (ZenCoding) 缩写语法 <!-- ul>li.item$*5 --> <ul> <li class="i ...

  4. 第 30 章 使用 Emmet 插件

    学习要点: 1.安装方式 2.自定义!生成 3.快速生成   主讲教师:李炎恢 本章主要探讨了解一下 Sublime Text3 的一个 HTML5 代码提示插件:Emmet,这个插件比自带原生的要强 ...

  5. [转载]Emmet使用

    转载地址:http://www.iteye.com/news/27580 Emmet的前身是大名鼎鼎的Zen coding,如果你从事Web前端开发的话,对该插件一定不会陌生.它使用仿CSS选择器的语 ...

  6. editplus中使用emmet?

    要用emmet生成html类型, 格式是: html:???, 意思是 都是html大类型, 小类型用冒号. 如:html:5, 或者全部都是! 则生成html5的类型文档. emmet是zen co ...

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

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

  8. Emmet:HTML/CSS代码快速编写神器

    本文来源:http://www.iteye.com/news/27580    ,还可参考:http://www.w3cplus.com/tools/emmet-cheat-sheet.html Em ...

  9. Emmet基本使用方法

      Emmet基本使用方法 分类: 其他文章2013-10-29 14:53 4048人阅读 评论(0) 收藏 举报 转载来自:http://www.iteye.com/news/27580 Emme ...

随机推荐

  1. Transpose File

    Given a text file file.txt, transpose its content. You may assume that each row has the same number ...

  2. C /CLI思辨录[阅读记录]

    C /CLI思辨录之拷贝构造函数(避免多个实例在相同的堆对象的错误处理) http://west263.com/info/html/chengxusheji/C-C--/20080224/9247.h ...

  3. Atom package安装失败的解决方案

    cd ~/.atom/package git clone [package url] cd [package name] apm install [package name] if lack some ...

  4. OC之JSON数据解析

    JSON介绍: 作为一种轻量级的数据交换格式,正在逐步取代XML,成为网络数据的通用格式 基于JavaScript的一个子集 易读性略差,编码手写难度大,数据量小 JSON格式取代了XML给网络传输带 ...

  5. xml和html之间相互转换

    一.xml转换html xml+xslt是典型的数据与表现分离的设计方式.当然,你可以直接转换成HTML,但是如果你要进行整体变化的时候,XML+XSLT的优势就体现出来了.同样的数据,因为你已经有X ...

  6. Android编译输出 资源指定AAPT

    BoardConfigCommon.mk # Default Command lineSEC_DEV_APP_LOCAL_AAPT_FLAGS := -c sw360dpSEC_DEV_FRAMEWO ...

  7. java学习之 垃圾回收

    垃圾回收器始终以一个较低优先级的后台进程进行垃圾的回收工作,这样不会影响程序的正常工作. 通常只有当内存到达用尽的边缘而程序需要分配新的内存空间时,垃圾回收器才会执行. 垃圾回收的条件:1,垃圾回收器 ...

  8. CodeForces 554B(扫房间)

      CodeForces 554B Time Limit:2000MS     Memory Limit:262144KB     64bit IO Format:%I64d & %I64u ...

  9. instancetype 与 id for Objective-C

    instancetype.id.NSObject的区别 - simalone   1.instancetype只能用于方法的返回类型,而id用处和NSObject *类似. 2.instancetyp ...

  10. HTML中如何添加日历插件(JQUERY)

    日期插件的包为:mydate.js1:首先将日期插件的包引入到页面中 1 <script language="JavaScript" src="../Inc/Js/ ...