Chrome 開發人員工具提供許多強大的工具,可協助您深入檢查及改善網頁應用程式。
以下影片概略介紹六個基本工具,包括「檢查」按鈕、「裝置模式」,以及「元素」、「控制台」、「來源」和「網路」面板。此外,您將瞭解「樣式」分頁,以及自訂開發人員工具的方法。
觀看影片,瞭解如何:
- 檢查及編輯 DOM 元素。
- 使用 Box Model 以視覺化方式呈現元素尺寸,並變更元素的尺寸。
- 查看網頁在行動裝置上的呈現效果。
- 使用「Console」面板找出 JavaScript 錯誤。
- 使用「Sources」面板中的中斷點,對 JavaScript 進行偵錯。
- 在「網路」面板中分析及篩選網路活動。
- 模擬較慢的連線速度。
- 自訂開發人員工具。
如要深入瞭解相關資訊,請參閱開發人員工具總覽。