Emmet Documentation
Emmet — the essential toolkit for web-developers Emmet is a web-developer’s toolkit that can greatly improve your HTML & CSS workflow: <!doctype html> <html lang="en"> <head> <title>Demo</title> </head> <body> | </body> </html> ~~~ tooltip: Type CSS-like abbreviation type: ul#nav>li.item$*4>a{Item $} wait: 1000 tooltip: Run “Expand Abbreviation” action to expand it into HTML ::: “Expand Abbreviati
Emmetを始めるのに、とりあえずこれだけ覚えておけば大丈夫
バイト先で「新ゆとり世代」と言われました。れこです。 HTML、CSSを省略して書けるZen-Codingの後見、 Emmetについて書こうと思います。 やれCoffeeだTypeScriptだSassだ〜と手をつける前に、 もっと簡単に、デメリット無く作業効率をあげられます。 CoffeeScriptやSassなどのプリプロセッサ系とは違い、 CoffeeやSassの知識を開発メンバー全員が持ってないとならず、 結局自由が効かなくなる、ということはありません。 個人から使えて、チームで使ってもなお良し。 さらに、展開後のカーソルの位置がいい感じだったりと、 細かい気配りまで完璧です。 そんなEmmetを 僕が頻繁に使っている機能に焦点を当てて、紹介したいと思います。 Emmetの導入 Emmetは各種エディタ・IDEのプラグイン形式で配布されています。 お値段は無料です。 Web系の人が
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ページを開く
HTMLやCSSが手間なく書けるZen Coding | Zen Coding 1-1 | HTML+CSSコーディングが10倍速くなるZen Coding
