DevTools のヒント: DevTools の迅速なナビゲーション

Sofia Emelianova
Sofia Emelianova
GitHub

DevTools で迷子になった場合は、学習内容:

  • よく使うパネルやタブを、ドロワーとペア設定します。
  • パネルやオプションの場所がわからなくても、コマンド メニューからアクセスできます。
  • レイアウトの自動変更を無効にします。
  • DevTools 固有のショートカットを好みに合わせてカスタマイズする。

動画でこれらのヒントの実例をご覧になるか、以下の要点をご確認ください。

  • Esc キーを押してドロワーを開いたり閉じたりします。

    引き出し。

  • その他のツール。 [その他のツール] をクリックして、他のドロワー タブを開きます。

    その他のツールボタン: 他のドロワータブを開きます。

  • DevTools パネルと [Drawer] タブを並べ替え、[Drawer] との間で上下に移動して組み合わせることができます。

  • コマンド メニューを使用すると、コマンドの検索、実行、設定の切り替え、パネルやタブの開く場所を忘れた場合でも、簡単に操作できます。

    DevTools コマンド メニュー。

  • DevTools のレイアウトを auto から常に horizontal または vertical に変更します。

  • DevTools のショートカットをカスタマイズします。設定] をタップします。 [設定] > [試験運用版] > [キーボード ショートカット エディタを有効にする] をオンにします。

    [設定] でショートカットを編集する。

より実践的な学習については、DevTools のカスタマイズのチュートリアルをご覧ください。

詳しくは、次をご覧ください。