🔍
浏览器 DevTools快捷键大全
Chrome/Edge 内置Win / Mac31 条
Chrome/Edge 开发者工具快捷键大全：元素检查、控制台、网络与设备模拟的高频键位。
打开与面板 8 条
| Windows | 说明（点击按键即可复制） |
|---|---|
| F12 / Ctrl+Shift+I | 打开/关闭 DevTools |
| Ctrl+Shift+C | 检查元素模式（点哪查哪） |
| Ctrl+Shift+J | 直接开 Console |
| Ctrl+] / [ | 切换到下一个/上一个面板 |
| Ctrl+Shift+D | DevTools 位置切换（下/右/浮窗） |
| Ctrl+Shift+M | 设备模拟模式 |
| Esc | 开/关底部抽屉（Console等） |
| Ctrl+Shift+P | 命令菜单（Run Command） |
元素与样式 9 条
| Windows | 说明（点击按键即可复制） |
|---|---|
| Ctrl+F（Elements下） | 在DOM树中搜索 |
| Ctrl+Z | 撤销样式/DOM修改 |
| F2 | 编辑为HTML |
| H | 隐藏选中元素（visibility） |
| Delete | 删除选中元素 |
| ↑/↓（数值上） | 调大/调小CSS数值 ±1 |
| Shift+↑/↓ | CSS数值 ±10 |
| Ctrl+点击样式 | 跳到样式定义源码 |
| .（句点） | 给元素加类名 |
控制台与网络 10 条
| Windows | 说明（点击按键即可复制） |
|---|---|
| Ctrl+L | 清空 Console |
| ↑ / ↓ | 翻历史命令 |
| Tab | 自动补全 |
| Ctrl+R（Network录制中） | 刷新并重新录制 |
| Ctrl+E | 开始/停止网络录制 |
| Ctrl+F（Network下） | 按URL过滤请求 |
| F8 / Ctrl+\ | 暂停/恢复脚本执行 |
| F10 / F11 | 单步跳过 / 进入函数 |
| Ctrl+F8 | 断点开关 |
| Ctrl+Shift+R | 硬性重载（Network面板中） |
页面调试 4 条
| Windows | 说明（点击按键即可复制） |
|---|---|
| Ctrl+R | 普通刷新（保持DevTools） |
| 长按刷新按钮 | 弹出：正常/硬性/清缓存刷新 |
| Ctrl+8 | 打开Application面板（快捷索引） |
| Alt+点击展开箭头 | 展开全部子节点 |