## Web 开发者工具 >Web 开发者工具允许开发者测试和调试代码, 它们不同于网站生成器和 IDE, 因为 Web 开发者工具不直接参与网页的创建, 而是用于测试网站或 Web 应用的用户界面接口的工具. >Web 开发者工具是浏览器的加载项或内置功能. 当今最流行的web浏览器, Google Chrome, Firefox, Opera, Internet Explorer, 和 Safari 都内置工具用于帮助开发者, 并且在各自的插件下载中心, 还提供很多额外的加载项. >Web 开发者工具允许开发者使用各种各样的 Web 技术, 包括 HTML, CSS, DOM, JavaScript 和 其它浏览器能够处理的组件. 由于日益增长的需求, 更多流行的 Web 浏览器包括了更多面向开发人员的功能. 尽管大多数浏览器都配备了开发者工具, 但是 [谷歌开发者工具](https://developers.google.com/web/tools/chrome-devtools/) 是目前谈论最多, 应用最广泛的开发者工具. 我建议学习和使用 [谷歌开发者工具](https://developers.google.com/web/tools/chrome-devtools/), 因为谷歌开发者工具周围有学习 Web 开发者工具最好的资源. **学习使用谷歌开发者工具:** <ul> <li><a href="http://discover-devtools.codeschool.com/" target="_blank">Explore and Master Chrome DevTools</a></li> <li><a href="https://code.tutsplus.com/courses/chrome-developer-tools" target="_blank">Chrome Developer Tools</a> [watch][$]</li> <li><a href="http://www.pluralsight.com/courses/chrome-developer-tools" target="_blank">Using The Chrome Developer Tools</a> [watch][$]</li> </ul> **谷歌开发者工具文档:** <ul> <li><a href="https://developers.google.com/web/tools/chrome-devtools/#docs" target="_blank">Per-Panel Documentation</a></li> <li><a href="https://developers.google.com/web/tools/javascript/command-line/command-line-reference?hl=en" target="_blank">Command Line API Reference</a></li> <li><a href="https://developers.google.com/web/tools/iterate/inspect-styles/shortcuts" target="_blank">Keyboard &amp; UI Shortcuts Reference</a></li> <li><a href="https://developer.chrome.com/devtools/docs/settings" target="_blank">Settings</a></li> </ul> **新闻/简报/博客/建议:** * [Dev Tips](https://umaar.com/dev-tips/)