寫HTML和CSS的新方法
來源:程序員人生 發布時間:2014-01-07 09:55:03 閱讀次數:2712次
Zen Coding 一個用來簡化編寫 HTML,XML, XSL (或是其它一些諸如此類格式的編輯器)。其主要是用一種縮寫方式的語法來書寫大量重復和無味的HTML,很像CSS語法。下面是一個例子:
div#page>div.logo+ul#navigation>li*5>a
展開后會成為下面這個樣子:
<div id="page"> <div></div> <ul id="navigation"> <li><a href=""></a></li> <li><a href=""></a></li> <li><a href=""></a></li> <li><a href=""></a></li> <li><a href=""></a></li> </ul></div>
可以看出來,#代表ID,>代表下一層。
如果你寫下:
select>option#item-$*3
那么將會得到:
<select> <option id="item-1"></option> <option id="item-2"></option> <option id="item-3"></option></select>
看上去很不錯吧。目前,其支持如下的編輯器:
- AptanaHowToEn
- TextMate (Mac). Available in two flavors: basic snippets (Zen HTML and Zen CSS) and full-featured plugin (ZenCoding for TextMate). Bundles > Zen Coding menu item
- Coda (Mac) — external download, via TEA for Coda. Plug-ins > TEA for Coda > Zen Coding menu item
- Espresso (Mac) — external download, via TEA for Espresso. Zen Coding is bundled with Espresso by default, but you should upgrade ZC to latest version. Actions > HTML menu item
- Komodo Edit/IDE (crossplatform) — external download. Tools > Zen Coding menu item
- Notepad++ (Windows). Zen Coding menu item
- PSPad (Windows). Scripts > Zen Coding menu item
- <textarea> (browser-based). See online demo.
- editArea (browser-based). See online demo.
還有下面這些第三方的插件:
- Dreamweaver (Windows, Mac)
- Sublime Text (Windows)
- UltraEdit (Windows)
- TopStyle (Windows)
- GEdit (crossplatform) — Franck Marcia’s plugin, Mike Crittenden’s plugin
- BBEdit/TextWrangler (Mac) — external download
- Visual Studio (Windows) — external download
生活不易,碼農辛苦
如果您覺得本網站對您的學習有所幫助,可以手機掃描二維碼進行捐贈