|
譯自：Smashing Magazine
中文：Zen Coding: 一種快速編寫HTML/CSS代碼的方法
請尊重版權，轉載請注明來源！
在本文中我們將展示一種新的使用仿CSS選擇器的語法來快速開發(fā)HTML和CSS的方法。它由 Sergey Chikuyonok 開發(fā)。 你在寫HTML代碼(包括所有標簽、屬性、引用、大括號等)上花費多少時間？如果你的編輯器有代碼提示功能，你編寫的時候就會容易些，但即便如此你還是要手動敲入很多代碼。
在JavaScript方面，當我們想要在一個頁面上獲取某個特定的元素時，我們就會遇到同樣的問題，我們必須寫很多代碼，這就變得難于維護和重用。JavaScript框架應運而生，它們同時引入了CSS選擇器引擎�，F在，你可以使用簡單的CSS表達式來獲取DOM元素，這相當酷。
但是，如果你不僅僅可以用CSS的選擇器布局和定位元素，還能生成代碼會怎么樣？比如，如果你這樣寫：
div#content>h1+p
…然后就可以看到這樣的輸出： <div id="content">
<h1></h1>
<p></p>
</div>
有些迷惑吧？今天，我將向你介紹 Zen Coding ，一組用于快速HTML和CSS編碼的工具。最初由 Vadim Makeev在2009年4月提出 (文章為俄語)，由鄙人(也就是我)開發(fā)了數月并最終達到比較成熟的狀態(tài)。Zen Coding由兩個核心組件組成：一個縮寫擴展器(縮寫為像CSS一樣的選擇器)和上下文無關的HTML標簽對匹配器。看一下這個演示視頻來看一下它們能為你做些什么。
注意：該視頻原版位于Vimeo，地址在這里：http://vimeo.com/7405114，上面的視頻是我費盡周折從Vimeo上下載下來上傳到優(yōu)酷的，上傳后質量竟被大打折扣了，囧。youtube上也有一份視頻，是基于Aptana的演示，一樣很精彩：http://www.youtube.com/watch?v=ug84Ypwqfzk。
出處：前端觀察
責任編輯：bluehearts
上一頁 下一頁 Zen Coding:快速編寫HTML/CSS代碼 [2]
◎進入論壇網頁制作、WEB標準化版塊參加討論，我還想發(fā)表評論。
|
第 1 頁 Zen Coding:快速編寫HTML/CSS代碼 [1]
第 2 頁 
