快捷键

快捷键比较多，这里挑出几个常用的说一下
最后会给出一张比较完整的快捷键的表

下列快捷键可以在所有 开发者工具 面板中使用

在Elements 面板中使用的快捷键

在Styles 边栏中使用的快捷键

在控制台中使用的快捷键

区域截屏

选取页面中的一部分，保存为图片
1、打开开发者工具
使用 快捷键 F12 (Windows) 或 Cmd+Opt+I (Mac)

2、选择左上角的元素选择按钮，图标颜色变为蓝色即表示选中了

3、Windows 下按住 Ctrl，Mac 就按住 Command，然后点击鼠标左键在页面选择区域即可，松开鼠标后，截图自动下载。

4、图片自动下载好后，点击图片后面的箭头，可以在文件夹中显示

节点截图

选中页面中某一元素，保存为图片
1、打开开发者工具
使用 快捷键 F12 (Windows) 或 Cmd+Opt+I (Mac)

2、选中任意元素节点

3、打开命令工具
使用快捷键 Ctrl + Shift + p (Windows) 或 Cmd + Shift + p (Mac)

4、点击Capture node screenshot，或者输入这行中任意的关键字，比如输入node，也会出来这个选项，然后点击这个选项，图片会自动下载。

5、图片自动下载好后，点击图片后面的箭头，可以在文件夹中显示

截全屏

保存完整网页为图片
第一种方式
1、打开开发者工具
使用 快捷键 F12 (Windows) 或 Cmd+Opt+I (Mac)

2、打开命令工具
使用快捷键 Ctrl + Shift + p (Windows) 或 Cmd + Shift + p (Mac)

3、点击Capture full size screenshot，或者输入这行中任意的关键字，比如输入full，也会出来这个选项

4、图片自动下载好后，点击图片后面的箭头，可以在文件夹中显示