DevTools の新機能: コマンド メニューのショートカットと HTML 書式設定_html/css_WEB-ITnose

英語原文:

DevTools Digest: More power with the new Command Menu

著者: Paul Bakaus、翻訳: Guokai Han

注: 次の Cmd キーは Windows の Ctrl キーです。

Cmd+Shift+P でコマンド メニューが表示されます

ソース パネルのファイル ジャンプ コマンド Cmd + P は、しばらく前から使用されています。今回はさらに一歩進んで、一部のテキスト エディターと同様に、DevTools の重要な機能のほとんどをすばやく実行できるコマンド メニュー機能を追加しました。

任意の位置 (ページ上にフォーカスがある場合でも) Cmd+Shift+P を使用してコマンド メニューを表示し、文字を入力するときにコマンドをフィルター処理し (部分一致で十分です)、Enter キーを押します。見つかったら実行します。例:

• 外観: ダークテーマに切り替える (スイッチを入力してダークテーマとライトデフォルトテーマを切り替える)
• DevTools: 一番下にドック (Dock を入力して DevTools を一番下と右の位置に切り替える)
• モバイル : 検査デバイス… (inspect と入力して、デバイス デバッグ機能インターフェイスを開きます)
• ネットワーク: オフラインにする (go offline と入力して、ネットワーク パネルのオフライン設定を設定します)

コマンド メニューは、非常に高速にナビゲートして検出を支援する方法です。 DevTools の新しい設定と機能。

きれいに印刷された HTML

これまで、ソース パネルに JS および CSS ファイルのきれいに印刷された機能 (コードを読みやすい形式にフォーマットする) を実装していましたが、今回これを拡張しました。関数 to THML ファイルでは、HTML がフォーマットされるだけでなく、内部の JavaScript および CSS コンテンツもフォーマットされます。

投稿閲覧数: 16

特に明記されていない限り、この記事の内容はクリエイティブ コモンズ表示 3.0 ライセンスに基づいてライセンスされており、コード サンプルは Apache 2.0 ライセンスに基づいてライセンスされています。詳細については、利用規約をご覧ください。