译自:Smashing Magazine
中文:Zen Coding: 一种快速编写HTML/CSS代码的方法
请尊重版权,转载请注明来源!
在本文中我们将展示一种新的使用仿CSS选择器的语法来快速开发HTML和CSS的方法。它由 Sergey Chikuyonok 开发。 你在写HTML代码(包括所有标签、属性、引用、大括号等)上花费多少时间?如果你的编辑器有代码提示功能,你编写的时候就会容易些,但即便如此你还是要手动敲入很多代码。
在JavaScript方面,当我们想要在一个页面上获取某个特定的元素时,我们就会遇到同样的问题,我们必须写很多代码,这就变得难于维护和重用。JavaScript框架应运而生,它们同时引入了CSS选择器引擎。现在,你可以使用简单的CSS表达式来获取DOM元素,这相当酷。
但是,如果你不仅仅可以用CSS的选择器布局和定位元素,还能生成代码会怎么样?比如,如果你这样写:
div#content>h1+p
…然后就可以看到这样的输出: <div id="content"> <h1></h1> <p></p> </div>
有些迷惑吧?今天,我将向你介绍 Zen Coding ,一组用于快速HTML和CSS编码的工具。最初由 Vadim Makeev在2009年4月提出 (文章为俄语),由鄙人(也就是我)开发了数月并最终达到比较成熟的状态。Zen Coding由两个核心组件组成:一个缩写扩展器(缩写为像CSS一样的选择器)和上下文无关的HTML标签对匹配器。看一下这个演示视频来看一下它们能为你做些什么。
注意:该视频原版位于Vimeo,地址在这里:http://vimeo.com/7405114,上面的视频是我费尽周折从Vimeo上下载下来上传到优酷的,上传后质量竟被大打折扣了,囧。youtube上也有一份视频,是基于Aptana的演示,一样很精彩:http://www.youtube.com/watch?v=ug84Ypwqfzk。
出处:前端观察
责任编辑:bluehearts
上一页 下一页 Zen Coding:快速编写HTML/CSS代码 [2]
◎进入论坛网页制作、WEB标准化版块参加讨论,我还想发表评论。
|