WebサイトのHTMLやCSSをブラウザ上であれこれと
シミュレーションできるFirebug。
大変便利なツールですよね。
このFirebugをスマホ版のFirefoxで使う方法が
以下の記事に書かれていたのでご紹介します。
Google Chrome用の記事ですが、Firefoxでも同じ機能が利用できました。
↓↓↓
スマホのChromeモバイルでFirebugやHTMLソース表示を使う方法
上記で解説している作業内容を簡単にまとめてみます。
大まかな作業内容
１．スマホのChromeモバイルでFirebugやHTMLソース表示を使う方法のサイトを、スマホやタブレットのFirefox（またはChrome）で開く
２．「Firebug Lite」へのリンクをFirefox（またはChrome）のブックマークに追加
３．ブラウザのURL入力部分（ロケーションバー）をタップして、ブックマークを表示。
４．ブックマークに追加した「Firebug Lite」をタップすると、画面最下部に「Firebug Lite」が表示される
２．「Firebug Lite」へのリンクをFirefox（またはChrome）のブックマークに追加
３．ブラウザのURL入力部分（ロケーションバー）をタップして、ブックマークを表示。
４．ブックマークに追加した「Firebug Lite」をタップすると、画面最下部に「Firebug Lite」が表示される
1つだけ注意点が。
Google ChromeモバイルとFirefoxモバイルでは、
ブックマークレットの追加方法が異なっているようです。
以下にNexus7でのFirefox操作画像を掲載します。
一連の作業をぜひご参考にしてみてください。
Nexus7上でFirefoxを操作したときの画像
このように、Firefoxのブックマークに「Firebug Lite」を追加できたら、
自分が見ているサイト上でいつでもFirebugを起動可能です。
Firebugで検証したいサイトを表示させておいて、
URL部分からブックマークにアクセスするだけ。
画面が小さいので細かい作業は拡大必須ですね（笑）
ぜひご活用してみてください～。
