相信很多同学都有截图的需求，有时候一个网页的内容很多，根本没法把所有内容都截取在同一张图片上，有同学可能会把每页截图再重新拼接起来。
其实，我们可以使用工具和浏览器开发者工具来实现网页长图的截取。
以前我分享过一些工具，来实现抓取整个网页的信息内容。
但是这些工具截取出来的图片质量没有很高，在清晰度方面始终有些不足。
并且有些截图工具使用起来会比较麻烦。
所以，今天教大家怎么使用Chrome浏览器的开发者工具命令来截取网页的长图。
比如我现在想截取quora网站上的这个首页长图，从动图可以看到，这个首页的信息还是比较多的。
现在我们使用快捷键F12调出开发者工具，你也可以右击鼠标，然后找到检查元素，进入开发者工具
然后使用快捷组合键Ctrl+shift+P，打开一个可以输入命令查找文件的窗口
然后输入：Capture full size screenshot，意思是抓取全网页面的截图
然后Chrome浏览器就会自动抓取网页的截图，然后把这个网页截图保存到本地了
如果你只想截图当页面的内容，那么你可以直接输入：Capture screenshot，就可以截取屏幕当页的内容信息
如果你想再电脑端模拟手机版的截图，那么你可以在开发者工具的左上角，点击那个图标切换设备，你也可以使用快捷键Ctrl + Shift + M
当你点击之后，页面显示就会从网页版就会切换为手机版
如下动图
并且我们可以设置为不同手机的大小，模仿不同手机来截取长图，然后截取手机版的长图跟上面的方法一样
输入Capture full size screenshot，就可以了
网友评论