Vimmerなプログラマは迷わずZen-Codingしろ！ - idesaku blog
前々から気になっていた、Zen-Codingを試してみた。これはすばらしい！特にVimmer*1は迷わず使うべき。 プログラマの世界ではコピペは悪！しかし… 「"Hello."と３回表示するプログラムを書け」と言われたら、どう書く？ puts "Hello."と書いて、コピペで３行にするのさ！ puts "Hello." puts "Hello." puts "Hello." そんなわけない。もちろん、ループを使うだろう。 3.times { puts "Hello." } それでは、「HTMLで３項目からなるリストを書け」と言われたら？ <ul> <li></li> <li></li> <li></li> </ul> ……今、liを書いてコピペして増やさなかった？ こういうときも、プログラミングするときみたいに書ければなぁ。 という願望を満たしてくれるのが、Zen-Codingだ。このケ
Emmet CSSショートコード
Emmetは、Zen-Codingの次期バージョンの名前です。 Zen-CodingはHTMLの記述方法が取り上げられることが多いですが、個人的には、CSSの入力補助こそ真価が発揮されると思っています。 私は、EmmetまたはZen-Codingがなければ、CSSのプロパティを打つのが苦痛なほどです。 Emmetから、さらに多くのプロパティに対応し、数値も含めて展開できるようになりました。CSSの記述がより使いやすくなったので、紹介します。 Zen-Codingから使える CSSの展開は、ほとんどのZen-Codingから使えます。 Emmetではさらに使いやすくなりましたが、Emmetは現在開発中のため、不安定な部分があります。不安な方は、Zen-Codingをおすすめします。 プロパティに、ショートコードが用意されており、+でつないで展開(Expand Abbreviation)する形
Vimmer のための Zen-Coding 入門 - present
はじめに AppEngine アプリを作るようになって、HTML を記述する頻度がかなり上がりました。DreamWeaver みたいな高級アプリは持っていないので、Vim でゴリゴリ。メンドクセ〜。そろそろなんとかしたい。そこで Zen-Coding の出番です。 Zen-Coding とは 簡単に説明すると、 ul>li*3みたいな専用の記法で記述された HTML の構造を <ul> <li></li> <li></li> <li></li> </ul>という風に、普通の HTML タグに変換するシロモノ。多くのエディタや IDE のプラグインとして提供されています。 Vim で Zen-Coding を使う準備 Vim には zencoding.vim というプラグインがあるので、Zen-Coding を導入することができます。 ZenCoding.vim - vim plugins
Zen-Coding の CSS のチートシート - モノラルログ
Zen Coding で html をパパっと書くのはけっこう慣れてきたんですが、CSS をパパっと書くのはほとんどやったことなかったなあ、ちゃんと覚えたいなあと思いまして、とりあえずチートシートを探してみました。 Zen-Coding のオフィシャルに PDF があったんですが、全部盛り込まれててちょっと量が多い…覚えられない… できたら印刷用に 1ページで、必要なやつだけまとまってるやつが欲しい… ということで、我流で、チートシートを作ってみました。 1ページに納まるように自分が使わなさそうなやつは外して、抜粋した感じで入れてあります。 ↓こちらの PDF です http://monaural.net/lab/zen/zen_css_cheatsheet.pdf これで勉強しまっす。 "margin-left" は "ml", "text-align" は "ta" みたいな感じでけっ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
URL変更のお知らせ - 士業JOB
HTMLの記述速度が劇的に向上。「WebMatrix」で“Zen Coding”を実現する拡張機能NOT SUPPORTED
https://toybox-design.net/?p=488
sakurachiro.com
