用Chrome(谷歌浏览器)对长网页(微信公众号、知乎)进行完整的截图

摘要:
当你需要对一个长网页进行完整的截图时,你可以直接使用谷歌浏览器提供的截图功能,而无需依赖第三方截图软件。打开的网页将变得像在手机上浏览:4。拍摄截图,切换到开发人员工具中的Console选项卡,输入快捷键Ctrl+Shift+P,将出现一个小输入框,您可以直接输入Capture,在自动提示的下拉列表中选择“Capturefullsizescreen”,然后单击enter。Chrome将开始对整个网页进行截图。

当需要对一个较长的网页进行完整截图时,可以直接使用谷歌浏览器(Chrome)自带的截图功能完成,不需要依赖第三方截图软件。

1. 打开网页

以微信公众号的页面作为示例:https://mp.weixin.qq.com/s/lyBoTpAHrysZQpO9xB9euA

由于微信公众号里的文章图片进行了延迟加载处理,因此需要从上到下滚动全文,确保每个图片都正确加载出来了再进行截图

2. 打开开发者工具

打开 Chrome 的开发者工具有几种方法。最简单的是按 F12,或者按Ctrl + Shift + I(字母 i),或者用鼠标点击菜单栏的【更多工具】【开发者工具】。

3. 开启手机浏览模式

点击开发者工具的手机设备图标,激活模拟手机设备浏览。

用Chrome(谷歌浏览器)对长网页(微信公众号、知乎)进行完整的截图第1张

 打开的网页会变成像在手机上浏览一样:

用Chrome(谷歌浏览器)对长网页(微信公众号、知乎)进行完整的截图第2张

4. 进行截图

在开发者工具里切换到 Console 标签,输入快捷键 Ctrl + Shift + P,会出现一个小输入框,在里面直接输入 Capture,在自动提示出来的下拉列表中选择 “Capture full size screenshot”,敲击回车,Chrome 就会开始对整个网页进行截图了。

用Chrome(谷歌浏览器)对长网页(微信公众号、知乎)进行完整的截图第3张

5. 截图展示

图片下载

请注意:此截图展示已经被我用工具手工的减小了体积!

P.S.

新版的 chrome 在 capture 下拉选择框新增了 “capture area screenshot”,指定在网页的任意区域截图。

免责声明:文章转载自《用Chrome(谷歌浏览器)对长网页(微信公众号、知乎)进行完整的截图》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇一个简单的日期控件php面试题2018下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

Android Studio 2.2的新鲜事

转载:http://mp.weixin.qq.com/s?__biz=MzAwODY4OTk2Mg==&mid=2652039482&idx=1&sn=9aa9b204af34baabd2fdbba649e20d79#rd Android Studio 2.2 现在可以下载。Android Studio 2.2 已在 Google I...

docker默认网段和主机网段冲突解决

一、 docker默认网卡docker0 172.17.0.0可能会与主机冲突,这时候需要修改docker默认分配的网段 1、修改/etc/docker/daemon.json文件,加入以下代码 {"default-address-pools":[{"base":"172.100.0.0/16","size":24}]} 其中上面的172.100.0.0/...

GIS开源程序收集

作者:粟卫民创建日期:2007-6-11最后修改:2007-6-22 注意: 每一个项目包含以下信息: 名称 主题 分类 描述 开始时间 语言 许可 演示网址 项目网址 成熟度 活跃度 评价 分类包括:GIS基础函数库、GIS控件、GIS桌面程序、GIS数据引擎、WEBGIS浏览器端程序、WEBGIS服务器程序、GPS相关程序,其它分类 派系:“NE...

快思软件,工具资料及学习网

1、快思聪官网手册   https://help.crestron.com/simpl_sharp/   https://help.crestron.com/SimplSharp/html/N_Crestron_SimplSharpPro.htm  (pro主机)   https://help.crestron.com/   https://help.cr...

Android开发环境搭建教程

全文转载于ReCclay,只做存储,便于查阅!侵权即删。 一、下载Android Studio 打开<官网>,直接点击下载   这里默认下载的是安装版并且不自带SDK(后期软件下载)   二、Android Studio安装 正式安装之前,最好先准备两个文件夹:一个用来存放安装程序,一个用来存放SDK。效果如下如图,所示。 注意:SD...

如何解决Google Chrome启动页面被篡改锁定和劫持?

步骤1:直接修改启动页设置 1 首先,检查Chrome设置。 点击Chrome浏览器右上角菜单。 点击设置。 2 启动时,设置为:打开新标签页。 或者点击“打开特定网页或一组网页”,进行手动设置,设置希望的主页。 END 步骤2:修复Chrome快捷方式 1 如果步骤1中的修改设置,在重启Chrome浏览器后,无法解...