如何在浏览器上对网页进行长截图

有时候我们常常需要将整个网页进行截图保存，我们常用的屏幕截图，例如QQ快捷键截图,整个屏幕截图快捷键，搜狗输入法快捷键截图等都无法满足要求。很多情况也只能是截图整个屏幕，一旦网页超过一屏，常用的截屏方法就无法满足要求。

本文讲解在浏览器中几种实现整个网页截图的方法，可以将整个网页截图保存下来，非常实用。

如果你使用的是IE浏览器，对不起你可以跳过该文章浏览其他的吧，这里主要讲的是针对 safari 和 chrome 浏览器。

在浏览器 Safari 中把整个网页长截图

在safari浏览器中这里列出两种把整个网页截图的方法，第一种通过插件，第二种利用safari自带打印功能导出pdf再转图片。

第一种方法，利用插件吧整个网页截图，这个插件名称叫「Awesome Screenshot」，步骤如下：

01、首先安装该插件，可以去下面地址下载。

Safari Awesome Screenshot 扩展下载

02、下载后你会在你的safari浏览地址栏左侧看到如下图这样一个图标。

image

03、点击该图标，会出现下拉选项，如下图所示。

image

选择最后一个选项，捕获整个网页，首先会在另一个浏览器页签中打开，这时可以可以通过顶部工具条对图片进行简单的编辑，根据需要你可以对生成图片的简单编辑，如下图所示：

image

04、点击「Done」按钮完成网页捕获操作，图片生成。

image

可以通过图片上右键保存图片到本地，也可以通过「Upload」按钮分享图片到[http://awesomescreenshot.com]

第二种方法，该方法通过点浏览器打印功能来保存长截图

01、点击菜单栏：「文件 - 打印（⌘+P）」调出打印预览界面。

点击「显示详情信息」默认的纸张大小是 A4，左边的预览图会显示打印此网页需要多少张 A4纸，如图：

image

02、点击「纸张大小 - 管理自定义大小」，会发现纸张高度和宽度是没有限制的。

image

将高度调整为可以容纳下整个页面的高度(默认高度 x 预览页数)，点击「好」按钮。然后点击左下角「 PDF」下拉选项，保存为PDF即可，如下图所示：

image

这时候再打开pdf文件，利用pdf文件保存为图片即可。

在 Google Chrome 浏览器中把网页长截图

01、首先我们需要在Google Chrome浏览器中打开开发者模式

可以通过在页面右键，菜单中点击「检查」就可以打开开发者模式，当然使用快捷键F12也可以打开，打开后效果类似如下：

image

02、在开发模式下通过快捷键打开工具弹窗。

macos下使用「shift+⌘+p」,windows下使用「shift+ctrl+p」来打开工具弹窗，打开后的工具窗口如下:

image

03、工具窗口中输入"cap",列表中会自动列出cap相关的工具。

image

选择「Capture node screenshot」就可以完成整个网页的长截图。

写在最后

如何在浏览器对网页进行长截图的介绍已经完成，希望对该篇指导文章的你有所帮助。如果你有什么疑问或更好的方法不妨在下面留言讨论。