cssのトラブルシューティングのためのツール

Question

私はfirebugとウェブ開発者のfirefoxアドオンを使ってほとんどのCSSのデバッグを行います。どちらも優れたツールです。しかし、スタイルシートとカスタムルールが混在している場合は、どちらのツールを使用しても最終的なプロパティ値が導出されたルールアプリケーションの順序を見ることができません。

私がこれらのツールで直面している難しさを説明する例を共有しましょう。私のサイトのあるページでは、特定のセクションのフォントサイズが他のセクションよりも大きくなります。 Firebugは、要素に適用されたすべてのCSSルールを表示します。それはまた私に破棄されたルールを示しています。これらはストライクスルーで示されています。これは素晴らしい！しかし、より大きなフォントサイズを担当する正確なクラスルールを見つけるためには、私が打ち負かされていないフォントサイズルールを見つけることができるまで、すべてのスタイルをスクロールしなければなりません。 CSSパネル（htmlパネルと違って）には "検索"機能がないようです。

これらの状況をどのように処理しますか？そこに良いツールがありますか？または、FirebugのCSSパネルで「叩かれていないフォントサイズ」を検索する方法はありますか？これは大きな問題ではないかもしれませんが、私の場合、この問題を乗り越えることができれば、時間を大幅に節約することができます。どんな助力も高く評価されます。あなたがブラウザを変更するために喜んでいる場合

おかげで、 Tabrez

Answer 1

Firebug内では、Firebugウィンドウの[Style]タブのドロップダウンオプションを表示します。

[適用されたスタイルのみ表示]オプションがあります。

Answer 2

は、Google Chromeのは、（右クリック>要素を検査）要素の機能を点検し、あなたの両方に一致するすべてのスタイル（スルー交差上書きのもの）を示しているだけでなく、教えてくれますちょうど計算されたスタイル。それはあなたにCSSファイルの行へのリンクを与えます。