« msgurlを使ってみた。 | トップページ | NICTのNTP(CNETの記事) »

2006/06/12

スタイルシートを目で見てチェック

ブックマークに追加する

リンク:rendr

スタイルシートの変更結果を即座に目で見ながら確認できるサイト。

このページにはデフォルトで小さなHTMLとCSSが用意されており、確認したいCSSの記述を画面上か入力することが出来るようになっている。

キーボードのショートカットも用意されており、[shift]+[esc]でHTMLの入力画面とCSSの入力画面を切り替えることができ、[control]+[space]で入力したHTMLやCSSを画面から隠したり表示したりを切り替えることが出来る。

なお、文字エンコードはUTF-8なので、日本語も入力可能。

最初に表示される画面はこんな感じ。

rendr最初の画面

この画面に表示されているMarkup(HTML)とCSSを編集するとすぐに画面に反映される。

rendrでCSSを編集

なお、このツールを使うに当たって、CSSの理解レベルは「CSSの理解レベルチェック法」のLevel3ぐらいが必要。
また、CSSの適当なドキュメントは手元にあった方が良い。


●お探し物は見つかりましたか?まだの方は以下の検索をご利用下さい。
 
当ブログ内 (within this blog) Web
●当ブログのRSSフィードをお手持ちのRSSリーダーにご登録いただくと、エントリ追加時のみ更新通知が届くため、確認の手間が省けます。よろしければ、どうぞ。
当ブログのRSSフィード
●当ブログの更新情報+α(deliciousのブックマーク他)はTwitter経由でも確認できます。是非フォローしてください。(実はRSSフィードよりも更新が早かったりします)

|

Ajax」カテゴリの記事

blog comments powered by Disqus


●Google広告


●その他の広告



トラックバック

この記事のトラックバックURL:

●トラックバックされる方へのご注意
本文中でこのエントリのアドレスを引用してください。引用(言及リンク)がない場合はスパム(迷惑行為)として削除します。
なお、迷惑行為かどうかを人力で判定しているため、トラックバックが反映されるまでに少々、お時間を頂いています。
For foreigners: If you would like to trackback to this entry, please include permlink of this entry in your entry. If your entry doesn't include this permlink, I will delete your trackback as spam.

この記事へのトラックバック一覧です: スタイルシートを目で見てチェック:

 
Google