このページでは、Chrome DevTools のキーボード ショートカットについて説明します。
ツールチップでショートカットを確認することもできます。DevTools の UI 要素にカーソルを合わせると、ツールチップが表示されます。要素にショートカットがある場合は、ツールチップにショートカットが含まれます。
DevTools を開くためのキーボード ショートカット
DevTools を開くには、ブラウザのビューポートにカーソルを置いて、次のキーボード ショートカットを押します。
| アクション | Mac | Windows / Linux |
|---|
| 前回使用したパネルを開きます | command option I | F12 または Ctrl Shift I |
| [Console] パネルを開きます | command option J | Ctrl Shift J |
| [要素] パネルを開きます | command shift C または command option C | Ctrl Shift C |
グローバル キーボード ショートカット
次のキーボード ショートカットは、すべてではありませんが、ほとんどの DevTools パネルで使用できます。
| アクション | Mac | Windows / Linux |
|---|
| 設定を表示 | ? または Function F1 | ? または F1 |
| 次のパネルにフォーカスする | command ] | Ctrl ] |
| 前のパネルにフォーカスする | command [ | Ctrl [ |
| 直前の装着位置に戻します。セッション全体で DevTools がデフォルトの位置にあれば、このショートカットにより DevTools が別のウィンドウにドッキング解除されます | command shift D | Ctrl Shift D |
| デバイスモードを切り替える | command shift M | Ctrl Shift M |
| [要素モードを検証] を切り替えます | command shift C | Ctrl Shift C |
| コマンド メニューを開きます。 | command shift P | Ctrl Shift P |
| ドロワーを切り替えます | Esc | Esc |
| 通常の再読み込み | command R | F5 または Ctrl R |
| ハードリロード | command shift R | Ctrl F5 または Ctrl Shift R |
| 現在のパネル内のテキストを検索します。[Elements]、[Console]、[Sources]、[Performance]、[Memory]、[JavaScript Profiler]、[Quick Source] の各パネルでのみサポートされます。 | command F | Ctrl F |
| ドロワーに [検索] タブを開きます。読み込まれたすべてのリソースのテキストを検索できます。 | command option F | Ctrl Shift F |
| [ソース] パネルでファイルを開く | command O または command P | Ctrl O または Ctrl P |
| 拡大 | command shift | Ctrl Shift |
| ズームアウト | command - | Ctrl - |
| デフォルトのズームレベルに戻す | command 0 | Ctrl 0 |
| スニペットを実行 | command O キーを押してコマンド メニューを開き、「!スクリプトの名前を入力して、Enter キーを押す | Ctrl O キーを押してコマンド メニューを開き、「!」スクリプトの名前を入力して、Enter キーを押す |
要素パネルのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| 変更を元に戻す | command Z | Ctrl Z |
| 変更をやり直す | command shift Z | Ctrl Y |
| 現在選択されている要素の上 / 下の要素を選択 | 上矢印 / 下矢印 | 上矢印 / 下矢印 |
| 現在選択されているノードを開きます。ノードがすでに展開されている場合は、このショートカットによってその下の要素が選択されます | 右矢印 | 右矢印 |
| 現在選択されているノードを閉じます。ノードがすでに折りたたまれている場合は、このショートカットでその上の要素を選択します | 左矢印 | 左矢印 |
| 現在選択されているノードとそのすべての子ノードを展開する、または折りたたむ | option キーを押したまま要素名の横にある矢印アイコンをクリックします。 | Ctrl Alt キーを押したまま、要素名の横にある矢印アイコンをクリックします。 |
| 現在選択されている要素の [属性を編集] モードを切り替えます | 入力 | 入力 |
| [属性を編集] モードに入ったら、次または前の属性を選択します。 | Tab / Shift Tab | Tab / Shift Tab |
| 現在選択されている要素を非表示にする | H | H |
| 現在選択されている要素の [HTML として編集] モードを切り替えます | Function F2 | F2 |
[スタイル] ペインのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| プロパティ値が宣言されている行に移動 | command キーを押しながらプロパティ値をクリックします。 | Ctrl キーを押しながらプロパティ値をクリックする |
| 色値の RGBA 表現、HSLA 表現、16 進数表現を切り替える | Shift キーを押しながら、値の横にある [カラー プレビュー] ボックスをクリックします。 | Shift キーを押しながら、値の横にある [カラー プレビュー] ボックスをクリックします。 |
| 次または前のプロパティまたは値を選択 | プロパティ名または値をクリックして、Tab / Shift Tab キーを押す | プロパティ名または値をクリックして、Tab / Shift Tab キーを押す |
| プロパティ値を 0.1 増減する | 値をクリックしてから、option 上矢印 / option 下矢印を押す | 値をクリックして、Alt 上矢印 / Alt 下矢印を押す |
| プロパティ値を 1 ずつ増減する | 値をクリックして、上矢印 / 下矢印を押す | 値をクリックして、上矢印 / 下矢印を押す |
| プロパティ値を 10 ずつ増減する | 値をクリックして、Shift 上矢印 / Shift 下矢印を押す | 値をクリックして、Shift 上矢印 / Shift 下矢印を押す |
| プロパティ値を 100 ずつ増減する | 値をクリックして、command 上矢印 / command 下矢印を押します。 | 値をクリックして、Ctrl 上矢印 / Ctrl 下矢印を押す |
| 角度値の度数（deg）、勾配（grad）、ラジアン（rad）、回転（ターン）表現を巡回表示 | Shift キーを押しながら、値の横にある [Angle Preview] ボックスをクリックします。 | Shift キーを押しながら、値の横にある [Angle Preview] ボックスをクリックします。 |
| 角度値を 1 ずつ増減する | 値の横にある [Angle Preview] ボックスをクリックして、上矢印または下矢印を押します。 | 値の横にある [Angle Preview] ボックスをクリックして、上矢印または下矢印を押します。 |
| 角度の値を 10 ずつ増減する | 値の横にある [Angle Preview] ボックスをクリックして、Shift 上矢印または Shift 下矢印を押します。 | 値の横にある [Angle Preview] ボックスをクリックして、Shift 上矢印または Shift 下矢印を押します。 |
| 角度の値を 15 ずつ増減する | 値の横にある [Angle Preview] ボックスをクリックして Shift キーを押し、[Angle Clock Overlay] をクリックするか、マウスでスライドします。 | 値の横にある [Angle Preview] ボックスをクリックして Shift キーを押し、[Angle Clock Overlay] をクリックするか、マウスでスライドします。 |
ソースパネルのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| スクリプトの実行を一時停止（現在実行中の場合）、再開（一時停止中の場合） | F8 または command \ | F8 または Ctrl \ |
| 次の関数呼び出しにステップ オーバー | F10 または command ' | F10 または Ctrl ' |
| 次の関数呼び出しにステップイン | F11 または command ; | F11 または Ctrl ; |
| 現在の関数からステップアウト | Shift F11 または Command Shift ; | Shift F11 または Ctrl Shift ; |
| 一時停止した状態で特定のコード行に移動する | command キーを押しながら、コード行をクリックします。 | Ctrl キーを押しながらコード行をクリックする |
| 現在選択されているフレームの下 / 上にある通話フレームを選択 | Ctrl . / Ctrl , | Ctrl . / Ctrl , |
| ローカルの変更に対する変更を保存 | command S | Ctrl S |
| すべての変更を保存 | command option S | Ctrl Alt S |
| 行に移動 | Ctrl G | Ctrl G |
| 現在開いているファイルの行番号に移動 | Command O キーを押してコマンド メニューを開き、「:」に続けて行番号を入力してから Enter キーを押します。 | Ctrl O キーを押してコマンド メニューを開き、「:」と入力し、その後に行番号を入力して Enter キーを押します。 |
| 現在開いているファイルの列（5 行目、9 列など）にジャンプ | Command O キーを押してコマンド メニューを開き、「:」、行番号、別の「:」、列番号の順に入力し、Enter キーを押します。 | Ctrl O キーを押してコマンド メニューを開き、「:」、行番号、別の「:」、列番号の順に入力し、Enter キーを押します。 |
| 関数宣言（現在開いているファイルが HTML またはスクリプトの場合）またはルールセット（現在開いているファイルがスタイルシートの場合）に移動する | Command Shift O キーを押してから、宣言またはルールセットの名前を入力するか、オプションのリストから選択します。 | Ctrl Shift O キーを押してから、宣言またはルールセットの名前を入力するか、オプションのリストから選択します。 |
| アクティブなタブを閉じる | option W | Alt W |
| 次のタブまたは前のタブを開く | Function command ↑ または ↓ | Ctrl PageUp または PageDown |
| 左側の [ナビゲーション] サイドバーを切り替えます。 | command shift Y | Ctrl Shift Y |
| 右側で [Debugger] サイドバーを切り替えます。 | command shift H | Ctrl Shift H |
コードエディタのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| 最後の単語からカーソルまでの文字をすべて削除 | option delete | Ctrl Delete |
| コード行ブレークポイントを追加または削除する | その行にカーソルを置き、command B キーを押します。 | その行にカーソルを置き、Ctrl B キーを押します。 |
| ブレークポイント編集ダイアログを開いて、条件付きブレークポイントまたはログポイントを編集します | その行にカーソルを合わせ、command Alt B キーを押します。 | その線にカーソルを置き、Ctrl Alt B キーを押します。 |
| [条件付きブレークポイント] ダイアログを開く | command 行番号をクリック | Ctrl 行番号をクリック |
| [logpoint] ダイアログを開く | command shift 行番号をクリック | Ctrl Shift 行番号をクリック |
| 対応する角かっこに移動 | Ctrl M | Ctrl M |
| 1 行コメントの表示 / 非表示を切り替えます。複数の行を選択した場合、各行の先頭にコメントが追加されます。 | command / | Ctrl / |
| カーソルがある単語の次に出現する単語を選択または選択解除します。各箇所が同時にハイライト表示されます | command D / command U | Ctrl D / Ctrl U |
ネットワーク パネルのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| 録画を開始 / 停止 | command E | Ctrl E |
| 再読み込みを記録する | command R | Ctrl R |
| 選択した XHR リクエストを再生する | R | R |
| 選択したリクエストの詳細を非表示にする | Esc | Esc |
| アクション | Mac | Windows / Linux |
|---|
| 録画を開始 / 停止 | command E | Ctrl E |
| Save recording | command S | Ctrl S |
| 録画を読み込む | command O | Ctrl O |
メモリパネルのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| 録画を開始 / 停止 | command E | Ctrl E |
コンソール パネルのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| オートコンプリートの候補を採用する | 右矢印または Tab キー | 右矢印または Tab キー |
| オートコンプリートの候補を拒否 | Esc | Esc |
| オートコンプリート リストを上下に移動する | 上矢印 / 下矢印または Ctrl P / N | 上矢印 / 下矢印または Ctrl P / N |
| 前の明細書を取得する | 上矢印 | 上矢印 |
| 次のステートメントを取得 | 下矢印 | 下矢印 |
| コンソールに重点を置く | Ctrl ` | Ctrl ` |
| コンソールをクリアします。 | command K または option L | Ctrl L |
| 複数行を強制的に入力します。DevTools はデフォルトで複数行のシナリオを検出するため、このショートカットは通常不要になりました。 | Shift Return | Shift Enter |
| 実行 | 返品 | 入力 |
| コンソールに記録されたオブジェクトのサブプロパティをすべて展開する | Alt キーを押しながら [開く >] をクリックします | Alt キーを押しながら [開く >] をクリックします |
[検索] タブのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| すべての検索結果を開く/閉じる | command option { または } | Ctrl Shift { または } |
レコーダー パネルのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| 録画を開始または停止する | command E | Ctrl E |
| 録音を再生 | command Enter | Ctrl Enter |
| 記録または選択したステップをコピー | command C | Ctrl C |
| コードビューを切り替える | command B | Ctrl B |
