mojoさんのblogで教えてもらった，とっても便利なブックマークレット，"CSS Debugger"。サイトのCSSがどのように定義されているかを，ビジュアルに表示してくれます。
CSS Debuggerは，codepoetryというサイトが元ネタのようです。
使い方は実に簡単。
（↑これ）を，Safariのアドレスバーにドラッグしてください。
次にご自分のblogなり，他の適当なサイトに移動して，アドレスバーのCSS Debugをクリックします。すると，そのサイトでどこにどのようにCSSが定義されているかが，一目瞭然に表示されるはずです。残念ながらIEではうまく動作しないそうなので，SafariかFirefoxでお試しください。
CSS Debugだと，CSSを表示しない通常の画面に戻すことができません。
そこでもう一つ，
CSS
Debug Toggle
（↑これ）というブックマークレットがあります。
こちらは，文字通りCSS表示／非表示をトグルで切り替えてくれますので，私はこっちを使い始めました。
スタイルシートの勉強には役立ちそうですが，なんか自分が裸にされたような気恥ずかしさもありありです。
※元のブログについたコメントを掲載させていただきます。
どもです。JAVASCRIPT::BOOKMARKLETに行くと、逆の動作をする「css解除」っていうのもあるです。
mojo | Homepage | 01.30.05 - 1:09 pm | #
今日は別サイトの，大幅なデザイン変更の作業をしていました。テーブルタグを一掃したり，スタイルシートも何度も作り直していたので，プレビューをCSS Debug でチェックできるのは大変助かりました。
J's Garage | Homepage | 01.30.05 - 9:39 pm | #
0 件のコメント:
コメントを投稿