Chrome 开发者工具是一套 Web 开发者工具，直接内置于 Google Chrome 浏览器中。 开发者工具可以帮助您即时修改页面和快速诊断问题，最终帮助您更快地构建更好的网站。
观看视频，实时演示开发者工具的核心工作流，包括调试 CSS、设计 CSS 原型、调试 JavaScript 和分析加载性能。
打开开发者工具
您可以通过多种方式打开开发者工具，因为不同的用户都希望能快速访问开发者工具界面的不同部分。
- 如需使用 DOM 或 CSS，请右键点击页面上的元素，然后选择检查以跳转到 Elements 面板。或者按 Command+Option+C (Mac) 或 Ctrl+Shift+C（Windows、Linux、ChromeOS）。
- 若要查看记录的消息或运行 JavaScript，请按 Command+Option+J (Mac) 或 Ctrl+Shift+J（Windows、Linux、ChromeOS）直接跳转到控制台面板。
如需了解详情和了解工作流程，请参阅打开 Chrome 开发者工具。
开始使用
如果您是经验丰富的 Web 开发者，不妨从以下几方面入手，了解开发者工具如何提高工作效率：
探索开发者工具
DevTools 界面可能会让人有点不知所措... 标签页太多了！不过，如果您花些时间熟悉每个标签页，了解其各自功能，那么您可能会发现开发者工具可以大幅提高您的工作效率。