Clever Geek Handbook

Zen Coding v0.7

昨日、Zen Codingと呼ばれる超高速レイアウト用のスクリプトセットの新しいバージョンがリリースされました。



主なものについて簡単に：

  1. テキストノード、略語の完全なメンバー 



    {sample text} {item number $ ${nl}}*5 p>{Click }+a{here}+{ to continue}


  2. 短縮ラッピングメカニズムの改善（Eclipseでのプレビューあり）。 デモでそれを見ることができます、次の略語でテキストをラップ（Ctrl + Shift + A）してみてください： 



     ul>li*>a{Click at $#} span[title=$#]{Element's title is $#}* ul>li*>span{$#}+{ }+a[title=$#]{$#}


    テキストタイプのリストを折り返すとき、マーカーをリセットするために|t



    キーを指定できます
  3. 要素グループの複製 



     dl>(dt+dd)*4


  4. 新しいアクション：

    • 数値の増減-カーソルの下の数値を1、10、または0.1ずつ変更します。
    • 数式の評価-カーソルの下で50/2 + 10のような簡単な数式を実行します

    • 次/前の項目を選択-HTML（開始タグの名前、完全な属性、属性名）およびCSS（通常、完全なプロパティ、プロパティ値）の次/前の要素をすばやく選択します。
    • CSS値の反映-ベンダープレフィックスを使用してCSSプロパティとその類似物の値をすばやく挿入できます。 



       -webkit-border-radius: 10px; -moz-border-radius: 5px; border-radius: 5px;


    • 画像をデータにエンコード/デコード：URI- src



      またはurl()



      、画像をdata:URL



      すばやく変換しdata:URL



      およびその逆
  5. 複数のタブストップ（Aptana / Eclipse、Espresso、TextMate、Komodo Edit）-Tabを使用してプロパティの値を移動すると、TextMateと同様に機能します。 デモのために、展開してみてください

    • CSS： bsha, brad+bsha



    • HTML： link:css*3



  6. より重要な更新：

    • CSSでも画像サイズを更新できるようになりました。
    • タイプselect>option*4



      略語（つまり、インライン要素内のブロック要素）が正しく展開されるようになりました。
    • 感嘆符を使用すると、CSSプロパティの略語に添え字が付けられます!important



      ： 



       pos:a! → position:absolute !important;


    • コロンの短縮形と加速用のスニペットは、ハイフン（ pos:a → pos-a



      ）で入力することもできます。
    • 単一行で出力するための新しいフィルター|s



      。
  7. 多くのクローズされたバグ（ Google Code Issuesを参照）。
  8. そして、ささいなことについてもう少し。


More articles:


All Articles