各ブラウザの開発ツールで HTML 要素を調べる方法

以前、Safari のデバッグツールを使って HTML の要素を調べる方法をご紹介いたしました。今回は主要なブラウザの最新バージョンを使って同じことをする方法をご紹介いたします。

IE10
F12キーで開発ツールを出し、マウスカーソルのアイコンをクリックすることで、要素を調べることができるようになります。

Firefox
Shift + Control + I で開発ツールを出して、マウスカーソルのアイコンです。
以下の画像は標準のデバッグツールですが、Firebug でも同じアイコンです。

Chrome
Shift + Control + I で開発ツールを出し、虫眼鏡のアイコンをクリック。
ちなみに、Opera は Chrome と同じ開発ツールだったため同じ操作です。

Safari
Shift + Control + I で開発ツールを出し、虫眼鏡のアイコンをクリック。