ブログを作るのに、スタイルシートで苦労していませんか？
びみょーなmarginやpaddingの設定や色合いの変更などに
便利なツールを見つけました。
ブログのスタイルシートを編集するときには、公開したページのHTMLをデストップに保存してスタイルシートをテキストエディタで編集して。。
ブラウザで確認して。。という作業になります。（よね？）
公開されているサイトのスタイルシート部分だけを変更して閲覧できるブラウザです。
Mozilla Firefox
スタイルシート（以下CSS）の編集は実際は拡張機能になります。
サイドバーにCSSを表示し、直接編集し、リアルタイムで反映します。
たとえばこのブログをFirefoxで表示してみます。
サイドバーを表示します。
CSSが表示されます。
EMPTYボタンを押すとCSSが消えます。オフのまっさらな状態に。
同じようにして、同じMOVABLE TYPEde作っている他のサイトのスタイルシートを表示して、ちょっと拝借してみます。
これはMybloglistに入れさせていただいてる浦和魂BLOGさん のCSSをペースト。
おー浦和風ぱるるアンテナ（笑）
またCSSを削除して同じくCafe de Neutralさん のCSSで。
京都風～じゃなくてちょっとセレッソ風かな。。
＃浦和魂BLOGさん、Cafe de Neutralさん勝手に使用してごめんなさい（ぺこ）
などと他人のCSSで遊ぶ為のツールぢゃなくて。。(^^;)
＃テンプレートを当てはめてみるのにはすごい便利ですね。
実際は編集とか思い切って色を変えてみたい時の確認に便利。
背景をグレーにしカレンダーの文字色を白にしてお知らせ部分の色を書き換えてみます。
うん。悪くないかも（笑）
不便な点としてはサイドバーでソースから検索とかが出来ないことや
タブキーが使えないことかな。
あと、15インチモニタで使用している人にはサイドバーは狭いかもしれません。
私の場合は1280×1024のディスプレイです。17ワイドでもよさそう。
ネット上のページのCSSを反映してみたり（同じようなclassになってないと面倒だけど）
いじったりできるのは意外な発見があって楽しいかも。勉強になりますね。
もちろんこれで編集した後他のブラウザで確認してください。
ブラウザについてはネスケとIE－2－も参考になるかもしれません。
ダウンロード ブラウザのダウンロードは以下からフリーで出来ます。 ・Firefox サイドバーでCSSを編集できるのはEdit CSSという拡張機能です。下記からインストールできます。 ・EditCSS
参考にさせていただいたサイト ありがとうございました。 ・Stylesheet Stylebook ・EditCSS/Stylesheet Stylebook
コメント (6)
Σ(゜д゜;)暴かれたー！！！！
あ、そうですね。
なんか今年のコスメの流行がピンクだったたけ、春バージョンにしているだけです。
ただ、サンガだから紫！というのは…まぁいつかやると思います。(笑)
しかしこれは便利そうだ、家に導入してみようと思います。
投稿者: 杏綬 | 2004年03月31日 10:59
日時: 2004年03月31日 10:59
きゃあっっ見つかった！（＾＾；）
なんだかんだでご挨拶はしてないので、はじめましてです（ぺこ）
杏綬さんにトラックバックしようかと思ったけど、関係ない記事にトラバるのもと思いリンクにさせてもらいましたです
もちろん京都＝紫とは限らないですよね。
うちもオレンジ少ないし。。（派手になる。。）
このツール何がいいって「ブラウザ」ってことですね。
投稿者: えみ | 2004年03月31日 16:29
日時: 2004年03月31日 16:29
はじめまして
すばらしいツールの紹介ありがとうございます。
CSSのカスタマイズに苦労していましたので大変助かります。
ただEdit CSSは日本語版のfirefoxではViewのSidebarに
Edit CSSのメニューが出ないのですね。さんざん悩みました。
英語版のfirefoxで表示されるようになったので日本語版の
バグでしょうか。とにかく無事動作するようになりました。
エスパルス今シーズン大変そうですが頑張ってほしいですね。
それでは失礼しました。
投稿者: tokusan | 2004年03月31日 17:02
日時: 2004年03月31日 17:02
tokusanさん（これだと「さん」がダブってる？）はじめまして(*^_^*)
そうなのですかー。
私は初めから英語版をダウンロードしちゃいました。
時間のあるときに日本語も試してみようかな。
動作するようになってなによりです。
ブログにお邪魔してみたら、貴重なエスパ系ではないですかーー
しかもトップ記事がご当地（笑）
投稿者: えみ | 2004年03月31日 19:35
日時: 2004年03月31日 19:35
早速入れてみましたよ。
使い勝手はと言うと、ソースが見やすくていいですね。
DreamweaverもCSSの編集できますが、ソース見ながら変更するのはEdit CSSの方が便利っぽい。
投稿者: 蔵人 | 2004年04月03日 00:34
日時: 2004年04月03日 00:34
そうですね。
補助機能がついてるわけでないので（たぶん）一からダイアログ使って作るのだったらDreamweaverでよいけど
プレビュー見ながらソースを編集するんだったらEdit CSSは便利ですよね(^^)
投稿者: えみ | 2004年04月04日 22:13
日時: 2004年04月04日 22:13