如何获得比浏览器支持的分辨率更高的分辨率的浏览器屏幕截图?


97

我需要拍摄一个网站的屏幕截图,因为它会出现在非常高分辨率的显示器上……例如4000x3000像素。我的笔记本电脑屏幕的原始分辨率为1400x768。基本上,我需要模拟显示器分辨率远高于显示器和视频卡实际支持的分辨率。我希望该网站的屏幕截图看起来与您在Firefox中反复按CTRL MINUS(缩小)时的工作方式差不多,但不会因缩放而导致像素丢失。我怎样才能做到这一点?有什么方法可以使用虚拟机软件来模拟超高分辨率显示?如果不是,是否有某种方法可以打开比屏幕大的浏览器窗口,然后以某种方式将其内容捕获为PNG?还有其他可行的方法吗?


您可能会尝试切换操作系统的dpi设置。我相信在Windows 8中,它需要更改注册表值。尽管这为您提供了一个巨大的桌面,但字体当然也会缩放,因此您必须更加费劲才能阅读文本。
jiggunjer,2015年

Answers:


104

您可以使用Firefox和2个扩展程序来做到这一点:Web DeveloperFireShot

一旦安装了两个扩展,请转到工具-Web开发人员-调整大小-编辑调整尺寸...。

添加新的尺寸4000 x3000。如果只希望页面内容为4000x3000,请选中“调整视口大小”。如果不选中它,则Firefox的完整窗口(带有工具栏,菜单等)将设置为此尺寸。

替代文字

大小正确后,转到工具-FireShot-捕获整个页面,然后...。选择一个动作,例如“保存”。它将保存由Web Developer设置为所需大小的页面内容。

替代文字


@snark-好吧,这几乎奏效。但是似乎Web Developer扩展不允许我将视口扩大到比屏幕大...?
约书亚·卡莫迪

@Joshua:对我来说很好。在发布答案之前,我进行了测试。我进行了新的测试,但找不到在哪里举办如此大的
赛事-Snark

1
更新:无法使窗口大于屏幕的问题似乎是Windows操作系统本身施加的限制。
约书亚·卡莫迪

@snark-您介意我问您正在运行什么操作系统吗?
Joshua Carmody

2
@snark-啊 也许这是Windows XP的问题(这就是我在这里遇到的问题)。无论如何,我都可以通过使用FireBug插入样式为“ =”宽度:4000px;高度:3000px;“的DIV来解决此问题。到HTML代码中,然后使用FireShot,所以我还是不错的。感谢您指出FireShot。这使我的生活更加轻松。我之前一直在滚动并拍摄屏幕快照,而不是手动合成它们。这是一个主要的痛苦。
约书亚·卡莫迪

19

同时(至少从版本15开始,至少有一两年的时间,如果我没记错的话),Firefox通过集成的开发人员工具直接支持此功能。

点击CtrlShift M或从条纹菜单中的“ 开发人员工具”图标中选择“ 响应式设计视图”

这将显示此视图,使您可以从一组预设中进行选择,以及输入任何所需的分辨率然后单击即可将PNG格式的屏幕截图直接保存到磁盘上:

在此处输入图片说明


1
当您通过放大来模拟Hi-dpi图像时,屏幕快照按钮可能无法正常工作。在这种情况下,请打开开发者工具栏Shift+ F2并粘贴screenshot --clipboard --fullpage到“控制台”中。这与常规的JS控制台不同。
刀片

这也适用于chrome开发者控制台设备测试模式。屏幕快照选项位于右上角的下拉菜单中。
Tully

不幸的是,这似乎不适用于Chrome;我只是试图在Microsoft Flow的Chrome浏览器中获取全视口屏幕截图(因为即使Firefox的全视域屏幕截图方法有效,Flow也无法在Firefox中正确显示),并且只获取了当前查看空间的屏幕截图...换句话说,Chrome的“捕获屏幕截图”和“捕获全尺寸屏幕截图”选项之间没有任何区别……可惜。
TylerH


6

我使用一个名为Abduction的FireFox插件来创建整个网页的.png快照。不幸的是,该插件尚未更新为与FireFox 3.6兼容。

看起来ScreenGrab会做同样的事情。


5

Firefox 16及更高版本现在具有使用开发者控制台控制视口大小的功能:

打开工具... Web开发人员...开发人员工具栏

使用以下命令调整视口大小:

resize to 5000 5000

使用此命令的屏幕截图:

screenshot output.png

4

好了,使用Linux(或任何版本的X Window System设置),您可以设置一个大于显示器的虚拟桌面。您可以在其中滚动,但是我认为您可以最大化浏览器并对其进行屏幕截图。

我不知道在Windows或OS X中是否有办法。



1

在Chrome中,有几个扩展名,例如:

还有另一个网页屏幕快照,但是我的声誉不足以发布两个以上的链接

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.