top


総投稿数 本 
no_

スポンサーサイト

 --------
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
カテゴリ :スポンサー広告 トラックバック(-) コメント(-)
no_1324

Zen-Coding:ちょこっと決め事覚えるだけで、こりゃほんとに便利、Zen-Coding。あぁ、もっと早くやれば良かった ・・・ 【コーディング】

 2010-04-16
 Zen-Coding
 前回、gvim利用して使い始めたのだが、
  ・gvim で、Zen-Coding:巷で話題の「Zen-Coding」。やってみたかったが、これも気になってたエディタ「gvim」で、できるらしい ・・・ 【コーディング】

 ほんの少しの決め事だけでほんと便利。


 今は,とりあえず
 ・gvimエディタで実行して、
  それを使い慣れた、他のエディタなどに
  ペーストする方法で利用しているけれど、
 それでもほんと早くかける。


 もっといろんな事できるんだろうけど、
 基本の部分だけでもとても Cool!オススメです。


************************************************
◎  Zen-Coding 基本の使い方まとめ
                 :Zen-Coding

************************************************


 

 ■Zen-Coding における基本
  (css と同じく)
  □# で id指定のエレメントを作れ、
div#header
 ><div id="header"></div>
ul#viewlist
 ><ul id="viewlist"></ul>

  □. で class指定のエレメントを作れる
div.itemname
 ><div class="itemname"></div>
li.listitem
 ><li class="listitem"></li>

 

 ■入れ子は >
  並べるなら +
  □divブロック構造も、
div#wrapper>div#header+div#contents+div#footer
 >
<div id="wrapper">
<div id="header"></div>
<div id="contents"></div>
<div id="footer"></div>
</div>

  □テーブル(最近使わないけど)なんか便利,
table#viewtabale>tr>th.itemname+td.itemdata+td.itemdata
 >
<table id="viewtabale">
<tr>
<th class="itemname"></th>
<td class="itemdata"></td>
<td class="itemdata"></td>
</tr>
</table>

 

 ■回数で繰り返すなら *(回数)
  □上のテーブルは、
table#viewtabale>tr>th.itemname+td.itemdata*5
 >
<table id="viewtabale">
<tr>
<th class="itemname"></th>
<td class="itemdata"></td>
<td class="itemdata"></td>
<td class="itemdata"></td>
<td class="itemdata"></td>
<td class="itemdata"></td>
</tr>
</table>

 

 ■決まりきった階層構造は、(ただの)+
  □テーブルは、
table+
 >
<table>
<tr>
<td></td>
</tr>
</table>

  □ulリストは、
ul+
 >
<ul>
<li></li>
</ul>

  □dlリストは、
dl+
 >
<dl>
<dt></dt>
<dd></dd>
</dl>
 > こちらにあります:Zen HTML Selectors

 なんかもう・・・惚れてまうやろ。


FC2ブログランキング にほんブログ村 IT技術ブログ Webサイト構築へ ブログ王ランキング 人気ブログランキング 人気ホームページランキングへ


commentsコメント
comment_post












管理者にだけ表示を許可する
commentトラックバック
トラックバックURL:
http://metaboy.blog23.fc2.com/tb.php/1324-8e53d7bd
ようこそ
Add to Google 創るmetaboy:RSSフィード
My Yahoo!に追加
最新記事のRSS | 問い合わせ

仕事検索、アルバイト検索、依頼仕事の検索ポータル - 仕事検索.COM - www.jobkensaku.com ツクルン

創るmetaboy - WEB創る、サイト創る、何創る - 創ったmetaboy

 

リンク集

 

最近の記事

 

ブロとも申請フォーム
Sponserd by

さくらのレンタルサーバ さくらのレンタルサーバ
大容量・高機能レンタルサーバー heteml 大容量・高機能レンタルサーバー heteml
XREA (ValueDomain)
お名前.com お名前.com
名づけてねっと名づけてねっと
ムームードメインムームードメイン

 

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。