Firefox アドオン「Stylish」Firefoxカスタマイズ 関連リンク


つづき



【 firefoxの見た目を変える 】

[使い方]

Stylishを使って [ Firefoxの見た目を変える ] - zubolla.メモ
Firefox アドオンの Stylish の使い方| AUTHORITY SITE
ユーザーCSSのカスタマイズ - Mozilla Firefox まとめサイト
userchrome.css - Mozilla Firefox まとめサイト
ユーザスタイルシートによるカスタマイズ(1) - えむもじら
Mozilla Re-Mix: Stylish(ユーザースタイル集)
stylish 設定メモ | Numb.
Stylish で Firebug や Pentadactyl のフォントを変更する - blog.remora.cx
Firefox のサイドバーの背景色を変える & DOM Inspector の使い方 - 銀盤浴

firefox カスタマイズ css - Google 検索
firefox カスタマイズ userchrome.css - Google 検索
firefox カスタマイズ ユーザースタイルシート - Google 検索

firefox 見た目 Stylish - Google 検索
firefox 外観 Stylish - Google 検索

firefox stylish 使い方 - Google 検索

 
[userChrome.css]
 
userChrome.css - Google 検索
userChrome.css firefox - Google 検索
firefox userchrome.css 場所 - Google 検索

 
[XML名前空間]
 
XML名前空間の簡単な説明
XML名前空間 - Google 検索
XML名前空間 Firefox - Google 検索




[Firefoxテーマ]

テーマ - Mozilla Firefox まとめサイト
Themes | MDN
Theme changes in Firefox 3 | MDN
Creating a Skin for Firefox:Getting Started | Creating a Skin for Firefox | MDN
Mozillaのテーマの作成法
Mozillaのテーマの作成法
Firefox のテーマの作り方を調べた - daily dayflower
Firefox3.6に統合されたPersonasを試す - 大須は萌えているか?
Firefox1.5テーマ作成方法

Firefox テーマ - Google 検索




[DOM Inspector]

DOM Inspector :: Add-ons for Firefox - ダウンロード
DOM Inspector - Firefox更新情報 Wiki*
DOM Inspector - Wikipedia
DOM Inspector - DOM Inspectorの概要 - Weblio辞書

DOM inspector - Mozilla Firefox まとめサイト
DOM Inspector 入門 | MDN
DOM Inspector FAQ | MDN
DOM Inspector の使い方の例 - 朝顔日記

jmblog: Firefox の DOM Inspector のインストールに関するメモ
Firefoxの DOM Inspector を使いこなしたい @ ArtSaltのサイドストーリー
FirefoxのDOMInspectorとStylishの使い方 - 巡回ログ
DOMInspectorとuserChrome.cssでFirefoxの外観を変更する方法 - 巡回ログ
Firebug コマンドラインのフォントを変更と・DOM Inspectorの使い方 | Web scratch
Mozilla L10N :: トピックを表示 - DOM Inspector の日本語リソース
徒波|Firefox のダイアログの幅を広くする ( DOM Inspector 覚書込み)
Firefox のサイドバーの背景色を変える & DOM Inspector の使い方 - 銀盤浴
local MDC: DOM Inspector 入門 (/ja/introduction_to_dom_inspector)
FirebugをDOM Inspectorにしてみる - Griever
Thunderbird プレーン・テキスト・メールの表示を調整する - 銀盤浴

要素の点滅(Blink Element)が動作しない場合の対処法 - digital 千里眼
あの不定記 DOM Inspector のインデントを減らす
DOM Inspector の拡張 - hogehoge @teramako
FirefoxのDOM Inspector - メェのボヤキ
暗色背景テーマでDom Inspectorの左側ペインを見やすく - きれいさっぱり、逝くぜ!

Firefox DOM Inspector - Google 検索
Firefox DOM Inspector 使い方 - Google 検索





Firefox アドオン「Stylish」関連リンク


ググるのめんどくさい人用



【 ダウンロード及びインストール方法 】

次世代ブラウザ Firefox — 高速・安全・カスタマイズ自在な無料ブラウザ
Stylish :: Add-ons for Firefox

インストール手順 (Windows) | 操作方法 | Firefox ヘルプ
Firefox ダウンロード及びインストール方法
アドオンのインストール方法




【 firefoxの見た目を変える 】

こちらへ移動させました。




【 ウェブサイトの見た目を変える 】

[使い方]

Stylishを使って [ Firefoxの見た目を変える ] - zubolla.メモ
Firefox アドオンの Stylish の使い方 | AUTHORITY SITE
Stylish 用ユーザースタイルシートの作り方 | AUTHORITY SITE
Firefoxでユーザースタイルシートを使ってみよう/メールとウェブのお役立ちメモ
サイトの CSS を自由に改造できるアドオン 知らなきゃ絶対損するPCマル秘ワザ
ユーザスタイルシートによるカスタマイズ(2) - Stylish - えむもじら
ユーザーCSSのカスタマイズ - Mozilla Firefox まとめサイト
usercontent.css - Mozilla Firefox まとめサイト
usercontent.css/広告カット - Mozilla Firefox まとめサイト

@-moz-document - MDN
特定の要素を消す/すぐに忘れる脳みそのためのメモ
特定の文字列を含む「属性」を持つ要素を消す/すぐに忘れる脳みそのためのメモ
特定の URL ではじまるサイトのスタイルを書く/すぐに忘れる脳みそのためのメモ
【レビュー】よく見るWebサイトのデザインを新鮮に変更 - マイナビニュース


[暴満館] Stylishで偏執的なレイアウトを作成するための覚書
Snapshare : FirebugとStylishで誰でも簡単にページを書き換え
UserStyleSheet | 栞
KEN×KEN☆BLOG Firefoxでメイリオ
stylish 設定メモ | Numb.
猫でいいです(猫雑記) | ユーザースタイルシートの使い方
【最新版】ユーザーCSSの使い方【Firefox,Chrome,IE,Opera】 | 10press
[う][Firefox]人のサイトをカスタマイズできるプラグイン「Stylish」 | うかブログ
Firefoxアドオン「Stylish」の使えるスタイル8選 | きにきじ
2009年にお世話になった16のStylishスタイル | きにきじ
Stylish-Firefoxエクステンション-オリジナルCSS設定ができる - WEBデザイン BLOG

firefox stylish使い方 - Google 検索


[userContent.css]
 
usercontent.css - Google 検索
usercontent.css firefox - Google 検索
firefox usercontent.css 場所 - Google 検索

 
[HTML名前空間]
 
HTML名前空間 Firefox - Google 検索




【 ユーザースタイルシート 】(ユーザーCSS)

ユーザースタイルシート - Google 検索
ユーザースタイル firefox - Google 検索
ユーザースタイル firefox カスタマイズ - Google 検索
ユーザスタイルシート 優先順位 - Google 検索
ユーザーCSS firefox - Google 検索
ユーザーCSS firefox カスタマイズ - Google 検索

デフォルトスタイルシート - Google 検索

【 CSS 】

CSS リファレンス - Google 検索
スタイルシートリファレンス(目的別)
スタイルシート CSS [スタイルシートのカテゴリー一覧] - TAG index Webサイト

Mozilla CSS 拡張仕様 - Google 検索

[セレクタ]

スタイルシートリファレンス(目的別) - セレクタ
CSSの書式 - TAG index Webサイト
保存版!CSS3セレクタの説明書|Webpark
意外と知らない!?CSSセレクタ20個のおさらい|Webpark

css 書式 - Google 検索
スタイルシート 書式 - Google 検索
セレクタ 指定 - Google 検索
セレクタ css - Google 検索
セレクタ css3 - Google 検索
css 属性セレクタ - Google 検索



[Firebugの使い方]

Firebug
Firebugで始めるCSSデバッグ[to-R]
Firefox [Firebug] Web制作のために...チェック機能がほしい - できるネット+
【図解】今更ながらfirebugによるCSS調整のし易さについて。 | kimihiko Tech
ウェブの構造把握に便利なアドオン「Firebug」 [ホームページ作成] All About
意外と知られていない機能が多い!?Firebugの使い方 | THE HAM MEDIA BLOG
これも知らない!?知っていると便利なFirebugの使い方 | THE HAM MEDIA
小粋空間: Firebug の使い方:(X)HTML と CSS の確認・修正方法のまとめ
WebページのHTMLやCSSを簡単にチェックする! | Health is better than wealth
意外と知られていない機能紹介(プログラマ向け) | KAYAC engineers' blog






Stylishを使って [ ウェブサイトの見た目を変える ]


 
Stylish を使って ユーザースタイルシートを適用すると
ウェブサイトの見た目を思い通りに変更できます。
 
userChrome.css や userContent.css を直接 編集するのと違い
即座に変更を 反映できるようになります。
 
[以下 一部引用]



Firefox本体 / Firefoxアドオン[Stylish]をまだインストールしていない方は...

使い方 - リンク


【 動作確認バージョン 】 (確認日: 2012年3月)
Firefox 11.0
Stylish 1.2.6

新しいスタイルを書く


アドオンバーの左にある[アイコン]をクリック →
メニューの「新しいスタイルを書く」 →
「白紙のスタイル」を選択   → 「新しいスタイル」ウィンドウが開きます。

Stylish1




1.【 名前をつける 】

変更項目ごとにタイトルを付けられるので、
何を変更したか分かるようなタイトルにしておけば、管理も楽になります。


Stylish20




2.【 挿入 】

userContents.css に記述するような
サイトの外観を変更する ユーザースタイル の時は、
「挿入ボタン」→メニューから「HTML 名前空間を標準とする」を選択します。


Stylish21

・エディタ部の一行目に[何か]が挿入されます。

Stylish21




3.【 貼り付け 】 ユーザスタイルを貼り付けます。
4.【 お試し 】 適用したスタイルに問題がないか試します。
5.【 保存 】 「お試し」で問題なければ「保存」ボタンを押します。

Stylish23

※ 注![お試し]だけでは、即、反映されない場合もあります。



特定のドメインやURLのみ対象にする


・指定URLを開くと自動的にスタイルを適用してくれます。
・zubollaはよくわからないので.. 簡単な紹介だけですが..
 



ユーザースタイルの管理で 編集/無効化/削除


■ メニューの「スタイルの管理」 →
    [アドオンマネージャー] の [ユーザースタイル] 画面が開きます。

Stylish15

【 ユーザースタイルの管理 】
 
▼ ユーザースタイルの編集/無効化/削除を行います。

Stylish14



メニュー項目クリックで スタイル ON/OFF


■ メニュー項目のクリックで簡単にスタイルを ON/OFF コントロール

Stylish25



メニュー項目上のマウス右クリックで 編集/無効化/削除


■ メニュー項目の右クリックで、簡単 [ 編集/無効化/削除 ]

Stylish8





Stylishを使って [ Firefoxの見た目を変える ]


 
Stylish を使って ユーザースタイルシートを適用すると
Firefoxの見た目を簡単に変更できます。
 
userChrome.css や userContent.css を編集するのと違い
即座に変更を 反映できるようになります。
 
[以下 一部引用]



Firefoxアドオン[Stylish]をまだインストールしていない方は...
 

【 動作確認バージョン 】 (確認日: 2012年3月)
Firefox 11.0
Stylish 1.2.6

新しいスタイルを書く


アドオンバーの左にある[アイコン]をクリック →
メニューの「新しいスタイルを書く」 →
「白紙のスタイル」を選択   → 「新しいスタイル」ウィンドウが開きます。

Stylish1



1.【 名前をつける 】

変更項目ごとにタイトルを付けられるので、
何を変更したか分かるようなタイトルにしておけば、管理も楽になります。


Stylish10



2.【 挿入 】

userChrome.css に記述するような
Firefox の外観を変更する ユーザースタイル の時は、
「挿入ボタン」→メニューから「XUL 名前空間を標準とする」を選択します。


Stylish11

・エディタ部の一行目に[何か]が挿入されます。

Stylish12



3.【 貼り付け 】 ユーザスタイルを貼り付けます。
4.【 お試し 】 適用したスタイルに問題がないか試します。
5.【 保存 】 「お試し」で問題なければ「保存」ボタンを押します。

Stylish13

※ 注![お試し]だけでは、即、反映されない場合もあります。



ユーザースタイルの管理で 編集/無効化/削除


■ メニューの「スタイルの管理」 →
    [アドオンマネージャー] の [ユーザースタイル] 画面が開きます。

Stylish15

【 ユーザースタイルの管理 】
 
■ ユーザースタイルの編集/無効化/削除を行います。

Stylish14



メニュー項目クリックで スタイル ON/OFF


「挿入」 → 「XUL 名前空間を標準とする」で入れた一行部分を、
  削除するとメニューに表示できるようになりますが...


メニュー項目上のマウス右クリックで 編集/無効化/削除


■ メニュー項目の右クリックで、簡単 [ 編集/無効化/削除 ]

Stylish8



追記:


■ Firefox29からアドオンバーがなくなったので メニューバーアイコンから操作します。

fuftuks.png


■ 新しいユーザースタイルシートを適用する場合は
プロファイルをバックアップしておいたほうがいいかもです。
  
不正な値のスタイルを保存してしまうと Firefoxの表示がおかしくなったり
操作不能になってしまいます。
キー操作ができる場合はアドオンマネージャを Ctrl + Shift + A で開き スタイルを削除します。)
  
最悪、Firefox が起動できなくなった場合は
バックアップしておいたプロファイルに戻します






プロフィール

Author:zubolla
  
あ~
めんどくちゃい めんどくちゃい

全記事表示リンク

全ての記事を表示する

カテゴリ
検索フォーム