Chrome DevTools 重要快捷键(Mac)

访问 DevTools

打开/切换检查元素模式和浏览器窗口 Cmd + Shift + C
打开 Developer Tools 并聚焦到控制台 Cmd + Opt + J

全局

显示设置 ?
上/下一个面板 Cmd + [/]
更改停靠位置 Cmd + Shift + D
Device Mode Cmd + Shift + M
切换控制台 ESC
在所有源中搜索文本 Cmd + Opt + F
按文件名搜索（除了在 Timeline 上） Cmd + O、Cmd + P

Elements

展开/折叠节点及其所有子节点 Opt + 点击箭头图标
隐藏元素 H
切换为以 HTML 形式编辑 F2

style

转到源中样式规则属性声明行 Cmd + 点击属性
在颜色定义值之间循环 Shift + 点击颜色选取器框
编辑下一个/上一个属性 Tab、Shift + Tab
以 10 为增量增大/减小值 Shift + Up、Shift + Down PgUp、PgDown
以 100 为增量增大/减小值 Shift + PgUp、Shift + PgDown
以 0.1 为增量增大/减小值 Opt + 向上键、Opt + 向下键

Sources

暂停/继续脚本执行 F8、Cmd + \
越过下一个函数调用 F10、Cmd + ‘
进入下一个函数调用 F11、Cmd + ;
跳出当前函数 Shift + F11、Cmd + Shift + ;
转到行 Ctrl + G
转到成员 Cmd + Shift + O