DevTools のヒント: DevTools を開くさまざまな方法

Sofia Emelianova
Sofia Emelianova
GitHub

Chrome DevTools はさまざまな方法で開くことができます。お好きな文字盤を選んでください。

右クリックして [検証] をクリックします。

ページ上の要素を右クリックして、[検証] を選択します。

プルダウン メニューの [Inspect] オプション。

[その他のツール] メニュー

[その他メニュー。] > [その他のツール] > [デベロッパー ツール] を選択します。

[その他のツール] メニュー

ショートカット

キーボードをお使いの方は、次のショートカット クイック リファレンスをご覧ください。

OS 要素 コンソール 最後のパネル
Windows または Linux Ctrl + Shift + C Ctrl + Shift + J F12
Ctrl + Shift + I
Mac Cmd + Option + C Cmd + Option + J fn+F12
Cmd+option+I

ショートカットを覚える簡単な方法:

  • C は CSS の略です。
  • J（JavaScript 用）。
  • [I] は、ユーザー選択であることを示します。

新しいタブで DevTools を自動的に開く

Windows、Linux、MacOS で Chrome DevTools を自動的に開く方法については、新しいタブで DevTools を自動的に開くをご覧ください。

詳細