2006年01月29日

【Fx基本】 3-1. userChrome.cssをいじって外観をお好みに

CSS(カスケーティングスタイルシート)を使って外観をいろいろいじってみましょう。

まず、プロファイルフォルダを開いてください。Open Profile Folderを入れてある方は「メニューバー:ツール→Open Profile Folder」で。
その中の「chrome」というフォルダを開いてください。
新しく作ってもいいんだけど、「userChrome-example.css」というファイルがあるので、これを使っちゃいます。
「-example」を削って、「userChrome.css」という名前に変更してから開きます。

!!! ファイルを開き編集するときの注意 !!!
UTF-8という文字コードが使えるエディタじゃないと、文字化けしてしまいます。

Windows付属のWordPadではダメです。Notepadでは文字化けはしないものの、改行が効きません。
UTF-8対応のエディタをお持ちでない方は、何かと便利なそういうエディタをここで仕入れておきましょう。特にサイトをお持ちでHTMLやCSS、CGIをいじる方。
Windowsの方はMKEditor for Windowsが激しくオススメ! タブ式、色分け自由自在、箱型コピペなんかもできてCSS編集にもってこい。もちろんフリーウェア。(MK-SQUARE.COM HOMEPAGEの「SOFTWARE」から入手)
MACの方は、PHP向けアプリケーション 機能比較(エディタ編) for Mac辺りから探してみてください。

エディタさえどうにかすれば、やることはカンタンです。
ファイルを開いてみましょう。
元のファイルが「-example」であったことからもわかる通り、中には既にいろいろな例が書かれています(「/* */」で囲まれているのでコメント扱いとなり、このままでは機能しません)。
ここに自分の好きなものを加えていきます。
userchrome.css - Firefox まとめサイト
Firefox Customize - IKIMONO net club - userChrome.css を使うもの
hail2u.net - FirefoxのuserChrome.cssネタ
などで非常に多くの事例が紹介されています。
CSSがわかる人はすぐに記述方法がピンと来るでしょうし(強制的に上書きするために!importantを加えることを忘れずに)、わからない人はやりたいことを探してまるっとコピペだ!

それではお約束・あーこの設定そのまんま。横に長くなるので別ページ用意しました。
こちらからどうぞ→userChrome.css
「メニューバーから不要なものを消す」は不要なメニューアイテムを非表示 (裸電球)、「右クリックメニューから不要なものを消す」はChrome element names and IDs (MozillaZine Knowledge Base)をよく見てお好みに合わせ消すのが良いと思います。
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

この記事へのTrackBack URL
http://blog.seesaa.jp/tb/12056708
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。