在 PC 和移动设备上检查，编辑，调试 HTML、CSS 及 JavaScript。
如果你在寻找有关使用 Firefox 开发者工具的信息，你来对地方了——这个页面提供了核心工具和附加工具的详尽信息，以及更深层的信息，比如如何连接调试 Firefox 安卓版，如何拓展开发者工具和如何调试浏览器。
请探索侧边栏的链接，进一步浏览页面。如果你有任何有关开发者工具的反馈或问题，请在邮件列表或 IRC 频道（请查阅底部的社区链接）上向我们发送消息。如果你有任何特别关于文档的反馈或问题，MDN 讨论适合发帖。
注意：如果你是 Web 开发的初学者并且使用开发者工具，我们的学习 Web 开发文档可能会对你有所帮助 — 查看初识 Web和什么是浏览器开发者工具？ 作为一个较为合适的出发点。
核心工具
在右侧的开发工具, 在windows或者Linux使用 Ctrl + Shift + I , 或者在Mac OS X Cmd + Opt + I , 有几个按钮可用于执行操作或更改工具设置.
右手边的省略号菜单包括了若干命令，让你执行操作或改变工具设定。
 |
这个按钮只有在页面中包含多个 iframe 时才会显示。点击显示当前页面的 iframe 列表，选择你想操作的哪个。 |
 |
点击这个按钮来给当前页面截图。（注意：这个特性默认不会打开，只有在设置里开启，图标才会显示。） |
 |
切换至响应式布局设计。 |
 |
打开包括停靠模式、显示或隐藏分离式控制台和开发者工具设置的菜单。这个菜单还包括开发者工具的文档和 Mozilla 社区的链接。 |
 |
关闭开发者工具。 |
页面查看器
查看和编辑页面内容和布局。可视化页面的许多方面，包括盒子模型，动画和网格布局。
Web 控制台
查看由页面和 JavaScript 交互记录的信息
JavaScript 调试器
停止，浏览，检查和修改页面中运行的 JavaScript。
网络监视器
查看加载页面时的网络请求。
性能工具
分析网站的响应，JavaScript 程序和布局性能。
响应式设计模式
查看网站或app在不同终端和网络类型上的外观和行为。
无障碍环境
提供了一种访问页面的无障碍树的方法，允许你查看遗漏或需要注意的东西。
注意：称呼开发者工具的 UI 的整体性的术语是 Toolbox（工具箱）。
更多工具
这些开发者工具也内置在 Firefox 中。但不像上面的“核心工具”一样常用。
连接开发者工具
如果您使用快捷键或菜单打开开发者工具, 他们将定位由当前活动选项卡托管的文档。但是，你也可以将这些工具连接到其他目标上，无论是在当前的浏览器中，还是在不同的浏览器中，甚至是不同的设备上。
- 调试工具
- 调试在浏览器中运行的插件、内容页签及工作者线程。
- 连接到 Android 的 Firefox
- 将开发者工具连接到在 Android 设备上运行的 Firefox。
- 连接到 iframe
- 将开发者工具连接到当前页面中的特定iframe。
- 连接到其他浏览器
- 将开发者工具连接到 Android 上的 Chrome 和 iOS 上的 Safari。
调试浏览器
默认情况下，开发者工具将附加到网页或Web应用程序。 但是你也可以将它们连接到浏览器。 这对于浏览器和附加组件开发很有用。
扩展开发者工具
对于有关拓展 Firefox 开发者工具的信息，详见在 MDN 的浏览器拓展板块的拓展开发者工具。
从 Firebug 迁移
Firebug 已经寿终正寝(想了解为啥，请查看页面Firebug存在于Firefox 开发者工具)，我们明白，迁移到一个不太熟悉的开发者工具是具有挑战性的。 为了简化从 Firebug 到 Firefox 开发者工具的转换，我们写了一个简便的指南 — Firebug 迁移。
贡献
如果你想帮助改进开发者工具，这些资源将帮助你入门。