画像上のタブをクリックするとそれぞれのスクリーンショットが表示されます。
Firebug は、Web ページを閲覧中にクリック 1 回で使える豊富な開発ツールを Firefox に統合します。あなたはあらゆる Web ページの CSS、HTML、および JavaScript をリアルタイムに編集、デバッグ、またはモニタすることができます。
お気に召すまま
Firebug はたった 1 回キーを打つだけで呼び出せて、決してあなたの邪魔になることはありません。表示方法も、新しいウィンドウに開くか、あるいはあたかも検索バーのようにブラウザの下部に表示するかを選択できます。また、 Firebug をどの Web サイトで有効にするかを、きめ細やかに設定することができます。
HTML の調査と編集
Firebug はページの奥深くにある HTML 要素を簡単に発見できます。お探しの要素が見つかったなら、その詳細な情報が表示されます。また、あなたはその要素をリアルタイムに編集することができます。
CSS を調整
Firebug の CSS タブは、 Web ページのスタイルについてあなたが知りたいことのすべてを教えてくれます。もしその内容が気に入らなければ、あなたは CSS に変更を加えることができます。また、その変更を閲覧中の Web ページに即座に反映することができます。
CSS の距離計算法を視覚化
CSS のボックスが正しく配置されていないとき、その理由を理解するのが難しいこともあります。そんなときは Firebug があなたの目の代わりになります。Firebug はすべてのオフセット、マージン、ボーダー、パディング、およびサイズを測定し描き出します。
ネットワークの接続を監視
あなたが作成したページはロードにやたらと時間がかかります。でもそれは一体何故？ 夢中になって JavaScript を書きすぎたのか？ それとも画像を圧縮し忘れてしまったのか？ はたまた広告の表示元のサーバがお昼寝中とか？ Firebug はひとつひとつのファイルに対して考えられる、すべての要因を分析します。
JavaScript のデバッグと分析
Firebug は高機能な JavaScript デバッガを備えており、あなたは好きなときに JavaScript の実行を一時停止させ、状態を確認することができます。もしあなたのコードが少々遅いと感じたなら JavaScript 分析ツールを使用してパフォーマンスを測定することで、ボトルネックを素早く発見できます。
DOM を調査
DOM (Document Object Model) はオブジェクトと未実行の JavaScript ファンクションを巨大な階層構造で表したものです。Firebug はあなたの必要とする DOM の発見を手助けし、発見した DOM は即座に編集できます。
JavaScript のログを取る
バグ探しには、機能が豊富な JavaScript デバッガも良いですが、場合によっては可能な限りの情報をコンソールに出力する方が早いこともあります。Firebug はバグの発見を手助けする強力なログ出力機能を備えています。
