常规

截图:

设置:

  • 为开发者工具设置一个 主题 .
  • 改变按键绑定 为你所熟悉的其他编辑器,如 Vim, Emacs 或Sublime Text。
  • 激活或取消不同的工具 (还有更多的工具!)。

页面查看器

标签视图中:

选择元素时:

  • 按住 Shift 并点击元素来选择节点并保持选择模式 (拾取模式不会取消).
  • 使用 / 键来选择它的父/子元素 (如果它们很难被选择).

规则视图中:

  • 点击选择器后的查看按钮 ()来使所有匹配的元素高亮显示。
  • 点击element{} 规则后的查看按钮()来锁定当前元素的高亮显示。
  • 右击任意属性并选择 "Show MDN Docs" 来 在MDN 文档中查看这个属性
  • 点击被覆盖属性后的筛选按钮 ()来 查找其他覆盖它的属性
  • 右击属性的名称,值或者规则来复制该属性的名称,值,声明或者整个规则。

网页控制台

在所有面板:

  • Esc 键打开 split console; 用以调试页面以及审查节点。

命令行:

控制台输出:

调试

  • 点击黑箱按钮 (Icon for black boxing a JavaScript source)来在调试中跳过JavaScript库。
  • 按下Ctrl+Alt+F 组合键来在所有脚本搜索。
  • 按下Ctrl+D 组合键来搜索函数的定义。
  • 按下 Ctrl+L 组合键跳转到具体的行。

样式编辑器

  • 点击样式表前的黑箱按钮 (Icon for black boxing a JavaScript source) 来切换可见度。
  • 在 响应式设计模式下点击 @media 规则来切换模式。
  • 点击导入按钮 (Button to import a style sheet from the file system)来导出样式表或者点击创建按钮(Button to create a new style sheet)创建一个新的样式表。
  • 点击设置按钮并勾选 "显示原始来源" 来显示css预处理文件.

网络

存储

  • 右击列表头打开下拉菜单来显示或隐藏列。
  • 右击任意条目,点击“删除名字”来删除该条目或点击“删除全部”来删除全部条目。
  • 选择一个条目并在侧边栏中查看解析的值。

开发者工具条

文档标签和贡献者

 此页面的贡献者: ShirleyM
 最后编辑者: ShirleyM,