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

Emmet 可以快速的编写 HTML 和 CSS,输入指令如:

 ul#nav>li*4>a*4

敲击一下TAB 键,就会输出:

<ul id="nav">
<li><a href=""></a><a href=""></a></li>
<li><a href=""></a><a href=""></a></li>
</ul>

Emmet 并不是一款软件或者工具,它是一款编辑器插件,必须要基于某个编辑器使用。官网:http://docs.emmet.io/

目前支持如下编辑器:

Emmet的语法:~感觉跟JQuery的非常相似
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)
E*N
多项元素(ul#nav>li*5>a)
E+N
多项元素
E$*N
带序号的元素..........

缩写下载

演示:

http://www.iteye.com/news/27580

http://v.youku.com/v_show/id_XMTM4NDQwNzgw.html

相关文章,Emmet的安装:

如何将Emmet安装到到Dreamweaver?

如何将Emmet安装到到 Sublime text 3? 

如何将Emmet安装到 Notepad++?

插件下载

posted @ 2013-07-25 17:05  tinyphp  Views(14411)  Comments(0Edit  收藏  举报