Aptana Studio で Zen Coding を使おう!
Aptana Studio で Zen Coding を使おう!
Aptana Studio に Zen Coding インストール
- メニュー > ヘルプ > 新規ソフトウェアのインストールを選択
- ロケーションにhttp://zen-coding.ru/eclipse/updates/を指定して Zen Coding for Eclipse をインストール
-
これで Zen Coding が有効になります. 試しに
p.test
と入力して Ctrl + E を押してみてください.<p class="test"></p>
と展開されれば成功です.
Example
使用例です. 基本は css セレクタを書いて, Ctrl+E を入力して展開する流れになります.
要素とidを展開
p#test
<p id="test"></p>
要素とclassを展開
p.test
<p class="test"></p>
リストを展開
ul>li*4
<ul> <li></li> <li></li> <li></li> <li></li> </ul>
属性を指定して展開
input[type=submit]
<input type="submit" />
連番展開
ol>li.index$*4
<ol> <li class="index1"></li> <li class="index2"></li> <li class="index3"></li> <li class="index4"></li> </ol>
複数のタグを展開
section>h1+p+pre
<section> <h1></h1> <p></p> <pre></pre> </section>
ブロックで展開
html>(head>title)+(body>h1)
<html> <head> <title></title> </head> <body> <h1></h1> </body> </html>
分かりやすい使用例動画
不満は改行を含む展開をした際に, インデントが tab になっちゃってること. スペース4 に変える設定も見当たらない.
その他は概ね満足.
Aptana Studio で Zen Coding を使おう! http://t.co/LZhVDLF via @phi_jp
[…] Aptana Studio Aptana Studio で Zen Coding を使おう! それではよいコーディングライフを!! 何かわからないことがあればコメントやリプライ(Twitter: @DAI199)でどうぞ!! […]
Win7 64bit用でZenCordingもあぷたな導入方法 http://t.co/pxokxiRG と http://t.co/EfmC32Ez