Google は AI 技術を使用して、コンテンツをご希望の言語に翻訳しています。AI 翻訳には誤りが含まれる場合があります。
キーボード ショートカット
コレクションでコンテンツを整理
必要に応じて、コンテンツの保存と分類を行います。
このページでは、Chrome DevTools のキーボード ショートカットについて説明します。
ショートカットはツールチップにも表示されます。DevTools の UI 要素にカーソルを合わせると、ツールチップが表示されます。
要素にショートカットがある場合、ツールチップに表示されます。
DevTools を開くためのキーボード ショートカット
DevTools を開くには、カーソルをブラウザのビューポートに合わせた状態で、次のキーボード ショートカットを押します。
| アクション | Mac | Windows / Linux |
|---|
| 最後に使用したパネルを開く | Command+Option+I | F12 または Control+Shift+I |
| [Console] パネルを開く | Command+Option+J | Control+Shift+J |
| [Elements] パネルを開く | Command+Shift+C または Command+Option+C | Control+Shift+C |
グローバル キーボード ショートカット
次のキーボード ショートカットは、ほとんどの DevTools パネルで使用できます。
| アクション | Mac | Windows / Linux |
|---|
| [Settings] を表示する | ? または Function+F1 | ? または F1 |
| 次のパネルにフォーカスする | Command+] | Control+] |
| 前のパネルにフォーカスする | Command+[ | Control+[ |
| 最後に使用したドッキング位置に戻す。セッション全体で DevTools がデフォルトの位置にある場合、このショートカットを使用すると、DevTools が別のウィンドウにドッキング解除されます。 | Command+Shift+D | Control+Shift+D |
| [Device Mode] を切り替える | Command+Shift+M | Control+Shift+M |
| [Inspect Element Mode] を切り替える | Command+Shift+C | Control+Shift+C |
| [**Command Menu**] を開く | Command+Shift+P | Control+Shift+P |
| [Drawer] を切り替える | Escape | Escape |
| 通常の再読み込み | Command+R | F5 または Control+R |
| ハード再読み込み | Command+Shift+R | Control+F5 または Control+Shift+R |
| 現在のパネル内のテキストを検索する。[Elements]、[Console]、[Sources]、[Performance]、[Memory]、[JavaScript Profiler]、[Quick Source] パネルでのみサポートされています。 | Command+F | Control+F |
| [Search] タブを [Drawer] で開き、読み込まれたすべてのリソースでテキストを検索できるようにする | Command+Option+F | Control+Shift+F |
| [Sources] パネルでファイルを開く | Command+O または Command+P | Control+O または Control+P |
| 拡大 | Command+Shift++ | Control+Shift++ |
| 縮小 | Command+- | Control+- |
| デフォルトのズームレベルに戻す | Command+0 | Control+0 |
| スニペットを実行 | Command+O を押して [Command Menu] を開き、! と入力スクリプトの名前を入力して Enter を押す | Control+O を押して [Command Menu] を開き、! と入力スクリプトの名前を入力して Enter を押す |
[Elements] パネルのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| 変更を元に戻す | Command+Z | Control+Z |
| 変更をやり直す | Command+Shift+Z | Control+Y |
| 現在選択している要素の上下の要素を選択する | Up Arrow / Down Arrow | Up Arrow / Down Arrow |
| 現在選択しているノードを開く。ノードがすでに開いている場合、このショートカットを使用すると、そのノードの下の要素が選択されます。 | Right Arrow | Right Arrow |
| 現在選択しているノードを折りたたむ。ノードがすでに折りたたまれている場合、このショートカットを使用すると、そのノードの上の要素が選択されます。 | Left Arrow | Left Arrow |
| 現在選択しているノードとそのすべての子を開くまたは折りたたむ | Option を押しながら、要素名の横にある矢印アイコンをクリックする | Control+Alt を押しながら、要素名の横にある矢印アイコンをクリックする |
| 現在選択している要素の [Edit Attributes] モードを切り替える | Enter | Enter |
| [Edit Attributes] モードに入った後、次の属性または前の属性を選択する | Tab / Shift+Tab | Tab / Shift+Tab |
| 現在選択している要素を非表示にする | H | H |
| 現在選択している要素の [Edit as HTML] モードを切り替える | Function+F2 | F2 |
[Styles] ペインのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| プロパティ値が宣言されている行に移動する | Command を押しながらプロパティ値をクリックする | Control を押しながらプロパティ値をクリックする |
| CSS ルールを切り替える | Up Arrow / Down Arrow | Up Arrow / Down Arrow |
| CSS ルール内のプロパティとプロパティ値のコントロールを切り替える | Left Arrow / Right Arrow | Left Arrow / Right Arrow |
| プロパティ値の関数（var、calc、clamp など、点線の下線で識別される）にフォーカスしたときに CSS 値のツールチップを開く | Option+ Down Arrow | Alt+Down Arrow |
| 色の値の表現（RGB、16 進数、oklch など）を変更する | [Shift] を押しながら、値の横にある [Color Preview] ボックスをクリックする | [Shift] を押しながら、値の横にある [Color Preview] ボックスをクリックする |
| 次のプロパティまたは前のプロパティ、または値を編集する | プロパティ名または値をクリックして Tab / Shift+Tab を押す | プロパティ名または値をクリックして Tab / Shift+Tab を押す |
| プロパティ値を 0.1 ずつ増減する | 値をクリックして Option+Up Arrow / Option+Down Arrow を押す | 値をクリックして Alt+Up Arrow / Alt+Down Arrow を押す |
| プロパティ値を 1 ずつ増減する | 値をクリックして Up Arrow / Down Arrow を押す | 値をクリックして Up Arrow / Down Arrow を押す |
| プロパティ値を 10 ずつ増減する | 値をクリックして Shift+Up Arrow / Shift+Down Arrow を押す | 値をクリックして Shift+Up Arrow / Shift+Down Arrow を押す |
| プロパティ値を 100 ずつ増減する | 値をクリックして Command+Up Arrow / Command+Down Arrow を押す | 値をクリックして Control+Up Arrow / Control+Down Arrow を押す |
| 角度値の度（deg）、グラジアン（grad）、ラジアン（rad）、回転（turn）の表現を切り替える | [Shift] を押しながら、値の横にある [Angle Preview] ボックスをクリックする | [Shift] を押しながら、値の横にある [Angle Preview] ボックスをクリックする |
| 角度値を 1 ずつ増減する | 値の横にある [Angle Preview] ボックスをクリックして [Up Arrow] / [Down Arrow] を押す | 値の横にある [Angle Preview] ボックスをクリックして [Up Arrow] / [Down Arrow] を押す |
| 角度値を 10 ずつ増減する | 値の横にある [Angle Preview] ボックスをクリックして [Shift]+[Up Arrow] / [Shift]+[Down Arrow] を押す | 値の横にある [Angle Preview] ボックスをクリックして [Shift]+[Up Arrow] / [Shift]+[Down Arrow] を押す |
| 角度値を 15 ずつ増減する | 値の横にある [Angle Preview] ボックスをクリックして [Shift] を押しながら、[Angle Clock Overlay] をクリックまたはマウスでスライドする | 値の横にある [Angle Preview] ボックスをクリックして [Shift] を押しながら、[Angle Clock Overlay] をクリックまたはマウスでスライドする |
[Sources] パネルのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| スクリプトの実行を一時停止する（実行中の場合）か、再開する（一時停止中の場合） | F8 または Command+\ | F8 または Control+\ |
| 次の関数呼び出しをステップオーバーする | F10 または Command+' | F10 または Control+' |
| 次の関数呼び出しにステップインする | F11 または Command+; | F11 または Control+; |
| 現在の関数からステップアウトする | Shift+F11 または Command+Shift+; | Shift+F11 または Control+Shift+; |
| 一時停止中に特定のコード行に進む | Command を押しながらコード行をクリックする | Control を押しながらコード行をクリックする |
| 現在選択しているフレームの上下の呼び出しフレームを選択する | Control+. / Control+, | Control+. / Control+, |
| ローカルの変更を保存する | Command+S | Control+S |
| すべての変更を保存する | Command+Option+S | Control+Alt+S |
| 行に移動 | Control+G | Control+G |
| 現在開いているファイルの行番号に移動する | Command+O を押して [Command Menu] を開き、: と入力して行番号を入力し、Enter を押す | Control+O を押して [Command Menu] を開き、: と入力して行番号を入力し、Enter を押す |
| 現在開いているファイルの列に移動する（例: 5 行 9 列） | Command+O を押して [Command Menu] を開き、: と入力して行番号を入力し、: と入力して列番号を入力し、Enter を押す | Control+O を押して [Command Menu] を開き、: と入力して行番号を入力し、もう一度 : と入力して列番号を入力し、Enter を押す |
| 関数宣言（現在開いているファイルが HTML またはスクリプトの場合）またはルールセット（現在開いているファイルがスタイルシートの場合）に移動する | Command+Shift+O を押して、宣言またはルールセットの名前を入力するか、オプションのリストから選択する | Control+Shift+O を押して、宣言またはルールセットの名前を入力するか、オプションのリストから選択する |
| アクティブなタブを閉じる | Option+W | Alt+W |
| 次のタブまたは前のタブを開く | Function+Command+Up または Down | Control+Page Up または Page Down |
| 左側の [Navigation] サイドバーを切り替える | Command+Shift+Y | Control+Shift+Y |
| 右側の [Debugger] サイドバーを切り替える | Command+Shift+H | Control+Shift+H |
コードエディタのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| 最後の単語のカーソルまでの文字をすべて削除する | Option+Delete | Control+Delete |
| コード行のブレークポイントを追加または削除する | カーソルを行に合わせ、Command+B を押す | カーソルを行に合わせ、Control+B を押す |
| ブレークポイントの編集ダイアログを開いて、条件付きブレークポイントまたはログポイントを編集する | カーソルを行に合わせ、Command+Alt+B を押す | カーソルを行に合わせ、Control+Alt+B を押す |
| 条件付きブレークポイント ダイアログを開く | Command を押しながら行番号をクリックする | Control を押しながら行番号をクリックする |
| ログポイント ダイアログを開く | Command+Shift を押しながら行番号をクリックする | Control+Shift を押しながら行番号をクリックする |
| 対応するブラケットに移動する | Control+M | Control+M |
| 単一行コメントを切り替える。複数の行が選択されている場合、DevTools は各行の先頭にコメントを追加します。 | Command+/ | Control+/ |
| カーソルがある単語の次の出現箇所を選択または選択解除する。各出現箇所が同時にハイライト表示されます。 | Command+D / Command+U | Control+D / Control+U |
[ネットワーク] パネルのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| ヘッダー、ペイロード、レスポンスを検索する | Command+F | Control+F |
| 記録を開始 / 停止する | Command+E | Control+E |
| 再読み込みを記録する | Command+R | Control+R |
| 選択したリクエストの詳細を非表示にする | Escape | Escape |
| アクション | Mac | Windows / Linux |
|---|
| 記録を開始 / 停止する | Command+E | Control+E |
| 記録を保存する | Command+S | Control+S |
| 記録を読み込む | Command+O | Control+O |
[Memory] パネルのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| 記録を開始 / 停止する | Command+E | Control+E |
[Console] パネルのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| 予測入力の候補を採用する | Right Arrow または Tab | Right Arrow または Tab |
| 予測入力の候補を拒否する | Escape | Escape |
| 予測入力の候補リストを上下に移動する | Up / Down または Control+P / N | Up / Down または Control+P / N |
| 前のステートメントを取得する | Up Arrow | Up Arrow |
| 次のステートメントを取得する | Down Arrow | Down Arrow |
| [Console] にフォーカスする | Control+` | Control+` |
| [Console] をクリアする | Command+K または Option+L | Control+L |
| 複数行の入力を強制する。DevTools はデフォルトで複数行のシナリオを検出するため、通常はこのショートカットは不要です。 | Shift+Return | Shift+Enter |
| 実行 | Return | Enter |
| コンソールに記録されたオブジェクトのすべてのサブプロパティを開く | Alt を押しながら [Expand] > をクリックする | Alt を押しながら [Expand] > をクリックする |
[Search] タブのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| すべての検索結果を開く/閉じる | Command+Option+{ または } | Control+Shift+{ または } |
[Recorder] パネルのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| 記録を開始または停止する | Command+E | Control+E |
| 記録を再生する | Command+Enter | Control+Enter |
| 記録または選択したステップをコピーする | Command+C | Control+C |
| コードビューを切り替える | Command+B | Control+B |
[Layers] パネルのキーボード ショートカット
| アクション | Mac | Windows / Linux |
|---|
| 図を X 軸と Y 軸に沿って移動する | W（上）、A（左）、S（下）、D（右） | W（上）、A（左）、S（下）、D（右） |
| パンモードを切り替える | X | X |
| 回転モードを切り替える | V | V |
| 図の位置と回転をリセットする | 0 | 0 |
| 図を拡大する | Shift++ またはマウスホイールを上に動かす | Shift++ またはマウスホイールを上に動かす |
| 図を縮小する | Shift+- またはマウスホイールを下に動かす | Shift+- またはマウスホイールを下に動かす |
特に記載のない限り、このページのコンテンツはクリエイティブ・コモンズの表示 4.0 ライセンスにより使用許諾されます。コードサンプルは Apache 2.0 ライセンスにより使用許諾されます。詳しくは、Google Developers サイトのポリシーをご覧ください。Java は Oracle および関連会社の登録商標です。
最終更新日 2024-02-20 UTC。
[[["わかりやすい","easyToUnderstand","thumb-up"],["問題の解決に役立った","solvedMyProblem","thumb-up"],["その他","otherUp","thumb-up"]],[["必要な情報がない","missingTheInformationINeed","thumb-down"],["複雑すぎる / 手順が多すぎる","tooComplicatedTooManySteps","thumb-down"],["最新ではない","outOfDate","thumb-down"],["翻訳に関する問題","translationIssue","thumb-down"],["サンプル / コードに問題がある","samplesCodeIssue","thumb-down"],["その他","otherDown","thumb-down"]],["最終更新日 2024-02-20 UTC。"],[],[]]
