Chrome浏览器——开发者工具截屏干货

Google浏览器安装包(可执行文件-点击此处直接下载安装)【chrome80(80.0.3987.100)纯净无插件】

  • 使用快捷键 F12 调出开发者工具,你也可以右击鼠标,然后找到检查元素,进入开发者工具

在这里插入图片描述

  • 使用快捷组合键 Ctrl+shift+P ,打开一个可以输入命令查找文件的窗口

在这里插入图片描述

  • 然后输入: Capture full size screenshot ,意思是抓取全网页面的截图
  • 然后Chrome浏览器就会自动抓取网页的截图,然后把这个网页截图保存到本地了
    在这里插入图片描述
  • 如果你只想截图当页面的内容,
    那么你可以直接输入: Capture screenshot ,就可以截取屏幕当页的内容信息

在这里插入图片描述

  • 如果你想再电脑端模拟手机版的截图,
    那么你可以在开发者工具的左上角,点击那个图标切换设备
    你也可以使用快捷键 Ctrl + Shift + M

在这里插入图片描述

  • 并且我们可以设置为不同手机的大小,模仿不同手机来截取长图,
    然后截取手机版的长图跟上面的方法相同
    输入 Capture full size screenshot

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/GodOuO/article/details/105186035