google-chrome-devtoolsgoogle-chrome-devtoolsを使い始める


備考

このセクションでは、google-chrome-devtoolsの概要と、開発者がそれを使用する理由について概要を説明します。

また、google-chrome-devtools内の大きなテーマについても言及し、関連するトピックにリンクする必要があります。 google-chrome-devtoolsのドキュメントは新しいので、これらの関連トピックの初期バージョンを作成する必要があります。

Chrome開発ツールへのアクセス

クロムブラウザは任意のタブ(ウェルカムタブを除く)に開かれていますが、Chrome Dev Toolsを開くには3つのオプションがあります:

キーボード :タイプコマンド⌘ + option + i

ブラウザメニュー :[メニュー]> [その他のツール]> [開発ツール]をクリックします

クロム開発ツールのブラウザメニュー

プログラムメニュー画面上部 ): '表示'> '開発者'> '開発者ツール'をクリックします。

クロム開発ツールへのプログラムメニュー

メンバーに移動する(javaScript関数/ CSSルール)

ファイルを表示するときにCtrl + Shift + O (Macの場合は + Shift + O )を使用してjavaScript関数/ CSSルールに移動します。

ファイル名で検索

[ソース]タブでは、 Ctrl + O (Macの場合は + O )を使用してファイル名で検索します。