このページでは、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 |