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

Sofia Emelianova
Sofia Emelianova
GitHub

Chrome DevTools を開く方法はいくつかあります。好きなものを選びます。

右クリック > 検証

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

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

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

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

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

ショートカット

キーボードを好む方のために、ショートカットのまとめを用意しました。

OS 要素 Console 最後に表示したパネル
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 を自動的に開くをご覧ください。

その他の情報