DevTools の概要

Microsoft Edge ブラウザーには、Microsoft Edge DevTools と呼ばれる組み込みの Web 開発ツールが付属しています。 DevTools は、ブラウザーでレンダリングされた Web ページの横に表示される一連の Web 開発ツールです。

詳細な内容:

概要

DevTools は、Web ページと Web アプリを検査およびデバッグするための強力な方法を提供します。 ソース ファイルを編集し、Web サイト プロジェクトを作成することもすべて DevTools 環境内で行うことができます。

DevTools では、次の操作を行うことができます。

  • ビジュアル インターフェイスを備えたライブ ツールを使用して、Web ページ内の要素のスタイルを検査、調整、変更します。 ブラウザーがコンテンツを保存した場所を調べて、 .html、 .css、 .js、 .png のファイル形式を含め、Web ページを作成します。

  • さまざまなデバイスで Web サイトの動作をエミュレートし、さまざまなネットワーク条件を備えたモバイル環境をシミュレートします。 ネットワーク トラフィックを検査し、問題の場所を確認します。

  • ブレークポイント デバッグとライブ コンソールを使用して、JavaScript をデバッグします。 Web アプリのメモリの問題とレンダリングの問題を見つけます。

  • 製品のアクセシビリティ、パフォーマンス、互換性、セキュリティの問題を見つけ、DevTools を使用して見つかったアクセシビリティの問題を修正します。

  • 開発環境を使用して、DevTools の変更をファイル システムと Web から同期します。

ビデオ: DevTools ユーザー インターフェイスを理解する

ビデオのサムネイル画像

この少し古い、2022 年 9 月のビデオでは、DevTools の従来の UI を示しています。

  • ビデオには、 アクティビティ バーの代わりに、従来のメイン ツール バーが表示されます。
  • このビデオでは、(DevTools の下部にある) クイック ビュー パネルの代わりに、 ドロワーが表示されます。

DevTools を開く

Microsoft Edge では、マウスまたはキーボードを使用して、次のいずれかの方法で DevTools を開くことができます。 開くツールは、DevTools を開く方法によって異なります。

主な方法:

アクション 結果のツール
Web ページ上の任意のアイテムを右クリックし、[ 検査] を選択します。 DOM ツリーが展開され、右クリックしたページ要素が表示された要素ツール。
Ctrl+Shift+I (Windows、Linux) または Command+Option+I (macOS) を押します。 以前に使用したツール、 またはウェルカム ツール。
F12 キーを押します。 以前に使用したツール、 またはウェルカム ツール。

その他の方法:

アクション 結果のツール
Microsoft Edge ツール バーで、[設定など] ([設定など] アイコン) >その他のツール>開発者ツール を選択します。 以前に使用したツール、 またはウェルカム ツール。
Ctrl+Shift+J (Windows、Linux) または Command+Option+J (macOS) を押します。 コンソール ツール。
Ctrl+Shift+C (Windows、Linux) または Command+Option+C (macOS) を押します。 DOM ツリーが展開され、<body>要素が表示されている要素ツール。
Shift+F10 キーを押して右クリック メニューを開きます。 [検査] コマンドを選択するには、上方向キーを押してから Enter キーを押します。 DOM ツリーが展開され、<html>要素が表示されている要素ツール。
ページ要素にフォーカスを移動するには、 Tab キーまたは Shift+Tab キーを押します。 次に、 Shift+F10 を押して右クリック メニューを開きます。 [検査] コマンドを選択するには、上方向キーを押してから Enter キーを押します。 フォーカスされたページ要素を表示するために DOM ツリーが展開された要素ツール。

Web ページ内の項目を右クリックして DevTools を開く

DevTools を開く良い方法は、Web ページ上のアイテムを右クリックし、[ 検査] を選択することです。

デモ Web ページで [会社概要] リンクを右クリックし、[検査] コマンドを選択します

DevTools が開き、[要素] ツールの DOM ツリーで右クリックした要素が強調表示されます。

Microsoft Edge の右側で DevTools が開かれ、[要素] ツールの DOM ツリーで DOM 要素が選択されている

Microsoft Edge ツール バーを使用して DevTools を開く

Microsoft Edge ツール バーで、[設定など (...)] >その他のツール>開発者ツール を選択します。

Microsoft Edge の [設定など] メニュー、[その他のツール] サブメニュー、[開発者ツール] コマンド

新しいタブを開いたときに DevTools が自動的に開く

ブラウザーで新しいタブを開くたびに DevTools を自動的に開くには、次の手順を実行します。

  1. 次のように、コマンド ラインで Microsoft Edge を開き、 --auto-open-devtools-for-tabs フラグを渡します。

    Windows コマンド プロンプト:

    start msedge --auto-open-devtools-for-tabs
    

    Windows PowerShell:

    Start-Process -FilePath "msedge" -ArgumentList "--auto-open-devtools-for-tabs"
    

    macOS ターミナル:

    /Applications/Microsoft\ Edge.app/Contents/MacOS/Microsoft\ Edge --auto-open-devtools-for-tabs
    

    Linux の bash シェル:

    microsoft-edge --auto-open-devtools-for-tabs
    
スタートアップ ブーストを無効にする

重要:auto-open-devtools-for-tabs 経由で起動するときは、実行中の Microsoft Edge プロセスがあってはならないため、場合によっては edge://settings/system でスタートアップ ブーストを無効にする必要があります。

スタートアップ ブースト機能により、最小限の Microsoft Edge プロセスがバックグラウンドで実行され続けます。 これは auto-open-devtools-for-tabs の機能に干渉します。使用するには無効にする必要があります。 詳細については、「 スタートアップ ブーストに関するヘルプを表示する」を参照してください。

F12 キーのキーボード ショートカットをオフにする

F12 キーを押しても DevTools が開かないようにするには、次の手順を実行します。

  1. Microsoft Edge で、[ edge://settings/system] に移動します。

  2. [開発者ツール] セクションまで下にスクロールし、[F12 キーを使用して] トグルを開く [開発者ツール] をオフにします。

    [開発者ツール] セクションを含む [Edge 設定] ページ、および F12 キーを無効にするトグル

キーボードのサポート

マウスまたはキーボードを使用して DevTools を操作できます。 キーボード ショートカットは、機能にアクセスするための迅速な方法を提供し、アクセシビリティのために必要とされます。 キーボードやスクリーン リーダーなどの支援技術を通じて、さまざまなツールにますますアクセスできるようになりました。

キーボード ショートカットと支援技術を備えた DevTools 内を移動するを参照してください。

ブラウザーで DevTools がドッキングされている場所を変更する

DevTools は、ブラウザーの右側、左側、または下部にドッキングしたり、別のウィンドウにドッキング解除したりできます。 「DevTools の配置の変更 (装着解除、下にドッキング、左にドッキング)」を参照してください。

DevTools のズーム インまたはズーム アウト

DevTools UI は、Web ページと同様に HTML と CSS を使用して実装されるため、標準のキーボード ショートカットを使用して拡大/縮小できます。 DevTools とレンダリングされるページのズーム レベルは独立しています。

ブラウザーの DevTools 部分を拡大するには:

  1. フォーカスがまだ DevTools にない場合は、DevTools のどこかをクリックします。
  2. Ctrl++ または Ctrl キー+- (Windows または Linux) を押します。 または、Command++ または Command+- (macOS) を押します。

DevTools の縮小

表示されたページを拡大するには、そのページをクリックし、上記と同じキーボード ショートカットを使用します。

ズームを 100% に戻すには:

  1. ブラウザーの目的の部分 (DevTools またはレンダリングされたページ) にフォーカスがあることを確認します。
  2. Ctrl+0 または Ctrl+NumPad0 (Windows または Linux)、または Command + 0 (macOS) を押します。

ズームするには DevTools 設定:

  1. DevTools の設定で、右上の [閉じる (x)] をクリックします。
  2. 前述のように、DevTools のズーム レベルを変更します。
  3. [ 設定 ] (設定アイコン) ボタンをクリックします。

コマンド メニューを使用して DevTools をズームするには:

  1. [ DevTools のカスタマイズと制御 ] ([カスタマイズ] アイコン) メニュー ボタンをクリックし、[ コマンドの実行] を選択します。
  2. コマンド メニューで「ズーム」と入力し、ズーム コマンドを選択します。
    • ズーム レベルをリセットする
    • 拡大する
    • 縮小表示

ユーザー インターフェイスの概要

DevTools ユーザー インターフェイスには、次の主要な領域があります。

  • ツール、設定、ドキュメントなどにアクセスするために使用されるアイコンを含む上部の アクティビティ バー 。

    • アクティビティ バーで現在選択されているツールが表示される現在のツール領域。
  • ツールにアクセスするのに使用するタブが含まれている下部の クイック ビュー ツールバー。

    • クイック ビュー ツール バーで現在選択されているツールが表示される下部のツール領域。

DevTools が側面で開かれ、4 つの主要な UI 領域が強調表示された Microsoft Edge

既定では、 アクティビティ バー には次のツールが含まれています。

  • 検査 ツール ([検査ツール] アイコン) のトグル ボタン。

  • デバイス エミュレーション ツール (デバイス エミュレーション アイコン) ボタン。

  • ウェルカム ツール (ウェルカム ツール アイコン)。

  • 要素ツール (要素ツール アイコン)。

  • コンソール ツール (コンソール ツール アイコン)。

  • [ソース] ツール ([ソース] ツール アイコン)。

  • ネットワーク ツール (ネットワーク ツール アイコン)。

  • パフォーマンス ツール (パフォーマンス ツール アイコン)。

  • メモリ ツール (メモリ ツール アイコン)。

  • アプリケーション ツール (アプリケーション ツール アイコン)。

既定では、 クイック ビュー ツールバーには次のツールが含まれています。

  • コンソール ツール (コンソール ツール アイコン)。

  • [問題] ツール ([問題] ツール アイコン)。

アクティビティ バーのツール タブには、DevTools ウィンドウの幅に応じて、ツール名とアイコンが含まれているか、ツール アイコンのみが含まれています。 ウィンドウの幅が十分ある場合は、ツール名とアイコンが表示されます。 ウィンドウが狭すぎる場合は、ツール アイコンのみが表示され、ツール アイコンの上にマウス ポインターを置くとツール名が表示されます。

クイック ビューの場所を変更する

既定では、 クイック ビュー パネルは DevTools の下部にあります。 クイック ビュー パネルを DevTools の右側に配置することもできます。

クイック ビュー パネルを表示するには、Esc キーを押します。

クイック ビュー パネルの場所を変更するには、クイック ビュー ツールバーで、右側の [クイック ビューにドッキング] ボタン ([クイック ビューを右にドッキング] アイコン) ボタンまたは [クイック ビューを下部にドッキング] ボタンをクリックします。

DevTool の下部にあるクイック ビュー ツールバーに表示されている Dock クイック ビュー アイコン

アクティビティ バーの機能

DevTools は、現在ブラウザーに表示されている Web サイトを検査、デバッグ、および変更するための強大なパワーを提供します。 ほとんどのツールでは、変更がライブで表示されます。 ライブ アップデートにより、ツールは Web ページの外観、ナビゲーション、または機能を洗練するのに便利です。ページを更新したり構築したりする必要はありません。

タブとページを含むタブ付きのツール パネル

検査ツールとデバイス エミュレーション以外に、DevTools は、要素ツール、コンソール ツール、ソース ツールなどのタブ付きツールのセットに分かれています。 コマンド メニュー内、ツールはパネルと呼ばれます。 ツールのタブには、ツールの UI を含むパネルが含まれています。

上位レベルのタブ:

ツールは、 アクティビティ バー と クイック ビュー ツールバーのタブのセットにまとめられています。 ほとんどのツールはパネルとも呼ばれ ます。 パネルは、ツールの内部 UI です。 ツールには、 アクティビティ バー と クイック ビュー ツールバーに表示できるタブがあります。

下位レベルのタブ:

一部のツールのパネル内には、1 つ以上のタブ (タブ付きウィンドウ) のセットがあります。 たとえば、[ 要素 ] ツールには、[ スタイル]、[ イベント リスナー]、[ アクセシビリティ ] タブなどの一連のタブが含まれています。 他のツールの場合、ツールのパネルの左側にページが一覧表示されます。

アクティビティ バーとクイック ビュー ツールバー

DevTools の上部にあるアクティビティ バーと、Esc キーを押したときの下部にあるクイック ビュー ツールバーの 2 つのツールバーがあります。

アクティビティ バーには、次の機能が含まれています。

  • ツールのアイコン:
    • 検査ツール ([検査ツール] アイコン) のトグル ボタン。
    • デバイス エミュレーション (デバイス エミュレーション アイコン) ボタン。
  • ツール タブ:

    • ウェルカム ツール。
    • 要素ツール 。 永続的。
    • コンソール ツール。 永続的。
    • ソース ツール。 永続的。
    • ネットワーク ツール。
    • パフォーマンス ツール。
    • メモリ ツール。
    • アプリケーション ツール。
  • アイコン:

    • その他のツール (その他のツール アイコン) ボタン。
    • DevTools (カスタマイズ アイコン) メニュー ボタンのカスタマイズと制御。
    • ヘルプ (ヘルプ アイコン) ボタン。
    • 閉じる DevTools (DevTools アイコンを閉じる) ボタン。

機能を示すラベルが付いたアクティビティ バー

アクティビティ バーの機能については、以下で説明します。

アクティビティ バーでツールをピン留めして並べ替える

永続的な 要素ツール、 コンソール ツール、 ソース ツールに加えて、 アクティビティ バーに表示するツールを制御して、現在のアクティビティに集中するように DevTools をカスタマイズできます。

  1. [ その他のツール ] (その他のツール アイコン) ボタンをクリックして、使用可能なすべてのツールを一覧表示します。

    すべてのツールの展開された一覧を含む、アクティビティ バーの [その他のツール] メニュー

  2. ツールを選択して アクティビティ バーにピン留めします。 このツールは、DevTools を開くたびに アクティビティ バー に表示されます。

ピン留めされたツールをすべて表示するのに十分なスペースがアクティビティ バー にない場合は、開いているが表示されていないツールが [ その他のツール ] メニューに移動します。

アクティビティ バーに収まらないピン留めされたツールを表示する [その他のツール] メニュー

アクティビティ バーからツールのピン留めを解除するには、ツールのタブを右クリックして、[アクティビティ バーから削除] を選択します。

アクティビティ バーからツールを削除するには、[パフォーマンス] ツールのタブの右クリック メニュー

検査ツール

[検査ツール] ([検査ツール] アイコン) ボタンをクリックすると、現在の Web ページの要素を選択できます。 検査ツールがアクティブなときは、Web ページのさまざまな部分でマウスを移動すると、ページ要素に関する詳細情報と、ページ要素のレイアウト寸法、パディング、および余白を示すマルチカラー オーバーレイを取得できます。

この記事の最初の見出しにカーソルを合わせたまま検査ツール

デバイス エミュレーション

[デバイス エミュレーション] (デバイス エミュレーション アイコン) ボタンをクリックすると、現在の Web サイトがエミュレートされたデバイス モードで表示されます。 デバイス エミュレーション ツールを使用すると、ブラウザーのサイズを変更したときに製品がどのように反応するかを実行およびテストできます。 また、モバイル デバイスのレイアウトと動作の見積もりも提供します。

エミュレートされた携帯電話でのこの記事の DevTools 表示

モバイル デバイスのエミュレート (デバイス エミュレーション)を参照してください。

ウェルカム ツール

DevTools の新機能、チームへの連絡方法に関する情報が含まれ、特定の機能に関する情報が提供されます。

要素ツール

HTML と CSS を検査、編集、デバッグできます。 ブラウザーで変更をライブ表示しながら、ツールで編集できます。

要素ツールは、常にアクティビティ バーに表示されます。

コンソール ツール

コンソール ツールでは、次のことができます。

  • ネットワーク要求または JavaScript ログ ステートメントからログに記録されたメッセージを表示およびフィルター処理します。
  • リアルタイムで評価する JavaScript ステートメントを入力します。 式は、 ソース ツールの JavaScript デバッガーがブレークポイントで一時停止したときなど、現在のコンテキストで評価されます。

コンソール ツールは、常にアクティビティ バーとクイック ビュー ツールバーに表示されます。

「 コンソール」を参照してください。

ソース ツール

ソース ツールは、コード エディターおよび JavaScript デバッガーです。 プロジェクトを編集し、スニペットを維持し、現在のプロジェクトをデバッグできます。

ソース ツールは、常にアクティビティ バーに表示されます。

ネットワーク ツール

ネットワーク ツールを使用すると、ネットワークとブラウザー キャッシュからの要求または応答を監視および検査できます。 ニーズに合わせて要求と応答をフィルター処理し、さまざまなネットワーク状態をシミュレートできます。

「 ネットワーク アクティビティの検査」を参照してください。

パフォーマンス ツール

「 ランタイム パフォーマンスの分析 (チュートリアル)」を参照してください。

メモリ ツール

メモリ の問題を解決するを参照してください。

アプリケーション ツール

「 Cookie の表示、編集、および削除」を参照してください。

[その他のツール] ボタン

ツールをアクティビティ バーに追加するには、[その他のツール] (その他のツール アイコン) ボタンをクリックします。

DevTools メニューのカスタマイズと制御

DevTools の カスタマイズと制御 (DevTools のカスタマイズと制御) ボタンをクリックするとドロップダウン メニューが開き、次の操作を行います。

  • Dock DevTools.
  • アクティビティ バーをドッキングします。
  • テーマを選択します。
  • ショートカット キーを表示します。
  • DevTools 設定を変更します。
  • デバイス エミュレーションを開きます。
  • クイック ビュー パネルを切り替えます。
  • コマンドを実行します。
  • コードを検索します。
  • ファイルを開く。

ヘルプ ボタン

[ヘルプ] (ヘルプ アイコン) ボタンをクリックすると、次の項目を含むドロップダウン メニューが開きます。

[DevTools を閉じる] ボタン

DevTools の右上隅にある [DevTools を閉じる ] ([DevTools を閉じる] アイコン) ボタンをクリックして DevTools を閉じ、ウィンドウ全体を使用して現在の Web ページを表示します。

クイック ビュー ツール バーの機能

クイック ビュー パネルを使用して、アクティビティ バーで既に選択されているツールの下または右側に 2 つ目のツールを開きます。

  1. アクティビティ バーからツールを選択します。

  2. クイック ビュー ツール バーで、[その他のツール] (その他のツール アイコン) をクリックし、一覧から別のツールを選択します。

たとえば、アクティビティ バーで開いているネットワーク ツールの下にあるクイック ビュー パネルでレンダリング ツールを開きます。

上部にネットワーク ツール、下部にレンダリング ツールを備えた DevTools

クイック ビューの非表示または展開を行うには、[クイック ビューを折りたたむ] (折りたたみアイコン) または [クイック ビューを展開] (展開アイコン) をクリックするか、Esc キーを押します。

すべてのツールの概要

各ツールの概要については、「 ツールの一覧について」を参照してください。

ツール、タブ、またはパネル

"ツール"、"タブ"、"パネル" という単語は、多少交換可能です。 コマンド メニューでは、ツールはパネルと呼ばれます。たとえば、[要素] ツールは [要素] パネルと呼ばれます。 [ 要素] ツールに切り替えるには、[ 要素] タブをクリックします。[ その他のツール ] (その他のツール アイコン) ボタンと、ツールを選択するために使用されるリストがあります。 DevTools ツールは、DevTools パネルとも呼ばれ ます。

各ツールをカスタマイズでき、ツールの内容はコンテキストに基づいて変更できます。

アクティビティ バーとクイック ビュー ツールについて

その他のツール (その他のツール アイコン) ボタンは、アクティビティ バーとクイック ビュー ツールバーの両方に表示されます。 アクティビティ バーにあるその他のツールの一覧からツールを開くと、そのツールがアクティビティ バーに表示されます。 クイック ビュー ツール バーの [その他のツール] リストからツールを開くと、そのツールは [クイック ビュー] パネルで開きます。

タスク 手順
DevTools の上部にある アクティビティ バー でツールを開きます DevTools の上部にある アクティビティ バー で、[ その他のツール ] (その他のツール アイコン) をクリックし、ツールを選択します。
クイック ビュー ツール バーでツールを開く DevTools にフォーカスがあるときに、 Esc キーを押してクイック ビュー ツール バーを表示し、まだ表示されていない場合。 クイック ビュー ツールバーで、[その他のツール] (その他のツール アイコン) ボタンをクリックし、ツールを選択します。
ツールをクイック ビュー ツール バーからアクティビティ バーに移動する DevTools にフォーカスがある場合は、 Esc キーを押して クイック ビューを表示します。 クイック ビュー ツール バーでツールのタブを右クリックし、[一番上のアクティビティ バーに移動] を選択します。
ツールをアクティビティ バーからクイック ビュー ツールバーに移動する アクティビティ バーでツールのタブを右クリックし、[下へ移動] クイック ビューまたは [横に移動] クイック ビューを選択します。
既定のツール バー (アクティビティ バー または クイック ビュー) でツールを開きます DevTools にフォーカスがある場合は、Ctrl+Shift+P (Windows、Linux) または Command+Shift+P (macOS) を押してコマンド メニューを開きます。 ツールの名前を入力し、[ Show <tool> ] コマンドを選択します。

アクティビティ バーとクイック ビューのツールに加えて、DevTools には次のツールが含まれています。

関連項目

電源ヒント: コマンド メニューを使用する

DevTools には、Web サイトで使用する多くの機能が用意されています。 DevTools のさまざまな部分にはさまざまな方法でアクセスできますが、多くの場合、 コマンド メニューを使用するのが速い方法です。

DevTools のコマンド メニュー

コマンド メニューでは、ツールは "パネル" と呼ばれます。たとえば、[要素] ツールは [要素] パネルと呼ばれます。 [ 要素] ツールに切り替えるには、[ 要素] タブを選択します。

  1. コマンド メニューを開くには、次のいずれかの操作を行います。

    • [ DevTools のカスタマイズと制御 ] (DevTools のカスタマイズと制御) ボタンをクリックし、[ コマンドの実行] を選択します。
    • Ctrl+Shift+P (Windows、Linux) または Command+Shift+P (macOS) を押します。

    コマンド メニューを使用すると、DevTools で機能を表示、非表示、または実行するためのコマンドを入力できます。

  2. コマンド メニューで、ツールの名前 (変更など) の入力を開始し、[変更の表示] などの [表示] コマンドを選択します。 一致するコマンドが コマンド メニュー に表示されています。

    コマンド メニューには、'cha' を入力すると、[クイック ビューの変更ツールを表示] などのオプションが表示されます

  3. Enter キーを押して、[変更の表示] などの [表示] コマンドを選択します。 選択したツールが クイック ビュー パネルの下部に開きます。

    クイック ビュー パネルで変更ツールを開いた状態の DevTools

    変更ツールは、CSS を編集する場合に便利です。 この例では、 コマンド メニュー を使用すると、[ その他のツール ] (その他のツール アイコン) を選択し、[ 変更] を選択する代わりに高速に使用できます。 この例では、[ソース] ツールで.js ファイルを編集し、右クリックして [ローカル変更] を選択する代わりに、別の方法も提供します。

「Microsoft Edge DevTools コマンド メニューを使用してコマンドを実行する」も参照してください。

DevTools のカスタマイズ

作業方法のニーズに合わせて DevTools をカスタマイズできます。 設定を変更するには、[ DevTools のカスタマイズと制御 ] (DevTools のカスタマイズと制御) ボタンをクリックし、[ 設定](設定アイコン) を選択するか、 F1 キーを押します。

[ 設定>基本設定 ] ページでは、DevTools のいくつかの部分を変更できます。 たとえば、 ブラウザーの UI 言語 設定を使用して、ブラウザーで使用されているのと同じ言語を DevTools で使用できます。 別の例として、 テーマ設定 を使用して DevTools の色テーマを変更します。

DevTools のすべての設定

次のような高度な機能の設定を変更することもできます。

  • ワークスペースにローカル ファイルを追加します。
  • [ 無視リスト] を使用してライブラリ コードをフィルター処理します。
  • デバイス シミュレーションおよびテスト モードに含める デバイスを 定義します。 詳細については、「 モバイル デバイスのエミュレート (デバイス エミュレーション)」を参照してください。
  • ネットワーク 調整 プロファイルを選択します。
  • シミュレートされた場所を定義 します。
  • キーボード ショートカットをカスタマイズします。 たとえば、Visual Studio Code と同じショートカットを DevTools で使用するには、[Match shortcuts from preset>Visual Studio Code] (プリセットからショートカットを一致させる) を選択します。

すべてのキーボード ショートカットとそれぞれを Visual Studio Code のショートカットに一致させるメニュー

試験的な機能を試す

DevTools チームは、DevTools の 実験 として新機能を提供します。 各実験をオンまたはオフにできます。 Microsoft Edge DevTools の試験的機能の完全な一覧を表示するには、DevTools で、[設定] (設定アイコン) を選択し、[実験] を選択します。

DevTools に導入される最新機能をプレビューするには、毎晩ビルドされる Microsoft Edge Canary をダウンロードします。

関連項目:

関連項目